Pre loader

Show or Hide Rollover Legend Feedback when Mouse Enters, Leaves a Chart

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

0
0

Hi,

I am hoping that someone can help me with the following issue…
I am implementing a Multiple Charts binding where the itemsControl is binding to the RolloverData.SeriesInfo (Like the example of the rollover feedback) so I display a little panel at the top of the diagram displaying the x and y values.
unfortunately, when the mouse moves over a chart it shows the values but then if I move to the next chart it shows the X and Y values in both charts and what I want to happen is that when the mouse moves to the another chart the previous chart don’t display the panel with the values.
I am attaching a picture of what happens thanks:)

<SciChart:SciChartSurface x:Name="sciChartSurface" 
                                  DataSet="{Binding ChartData}" 
                                  SciChart:ThemeManager.Theme="Chrome" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">
            <SciChart:SciChartSurface.RenderableSeries>
                <SciChart:FastLineRenderableSeries SeriesColor="Red"/>
            </SciChart:SciChartSurface.RenderableSeries>

            <!--  Declare Axes  -->
            <SciChart:SciChartSurface.YAxis >
                <SciChart:NumericAxis AxisTitle="{Binding ChartName}" AxisAlignment="Left">
                    <SciChart:NumericAxis.GrowBy>
                        <SciChart:DoubleRange Min="0.1" Max="0.1"/>
                    </SciChart:NumericAxis.GrowBy>
                </SciChart:NumericAxis>
            </SciChart:SciChartSurface.YAxis>
            <SciChart:SciChartSurface.XAxis>
                <SciChart:DateTimeAxis AxisTitle="Time"
                                       DrawMajorGridLines="True"
                                       DrawMinorGridLines="True"  
                                       TextFormatting="HH:mm MMM dd" SubDayTextFormatting="HH:mm MMM dd">
                    <SciChart:DateTimeAxis.GrowBy>
                        <SciChart:DoubleRange Min="0.1" Max="0.1"/>
                    </SciChart:DateTimeAxis.GrowBy>
                </SciChart:DateTimeAxis>
            </SciChart:SciChartSurface.XAxis>

            <!--  Declare ChartModifiers  -->
            <SciChart:SciChartSurface.ChartModifier>
                <SciChart:ModifierGroup>
                    <SciChart:ModifierGroup SciChart:MouseManager.MouseEventGroup="myCustomGroup">
                        <SciChart:RubberBandXyZoomModifier IsEnabled="True"
                                                IsXAxisOnly="True" 
                                                ReceiveHandledEvents="True" />
                        <SciChart:ZoomPanModifier IsEnabled="False"/>
                        <SciChart:MouseWheelZoomModifier IsEnabled="False"/>
                        <SciChart:RolloverModifier x:Name="rolloverModifier" 
                                                   IsEnabled="True" 
                                                   ReceiveHandledEvents="True"/>
                        <SciChart:CursorModifier IsEnabled="False" ReceiveHandledEvents="True"/>
                        <SciChart:YAxisDragModifier/>
                        <SciChart:XAxisDragModifier/>
                        <SciChart:ZoomExtentsModifier/>
                </SciChart:ModifierGroup>
                </SciChart:ModifierGroup>
            </SciChart:SciChartSurface.ChartModifier>
        </SciChart:SciChartSurface>

        <Border Grid.Row="1"
                HorizontalAlignment="Left"
                VerticalAlignment="Top"
                Background="#77FFFFFF"
                BorderBrush="#55000000"
                BorderThickness="2">
            <ItemsControl DataContext="{Binding ElementName=rolloverModifier}" 
                          ItemsSource="{Binding RolloverData.SeriesInfo}">
                <ItemsControl.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition></RowDefinition>
                                <RowDefinition></RowDefinition>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Row="0" Grid.Column="0"
                                       FontSize="12"
                                       FontWeight="Bold"
                                       Foreground="Black"
                                       Text="Y Axis:"/>
                            <TextBlock Grid.Row="0" Grid.Column="1"
                                       FontSize="12"
                                       FontWeight="Normal"
                                       Foreground="Red"
                                       Text="{Binding  YValue, Converter={StaticResource toStringConverterConverter}}" />
                            <TextBlock Grid.Row="1" Grid.Column="0"
                                       FontSize="12"
                                       FontWeight="Bold"
                                       Foreground="Black"
                                       Text="DateTime:"/>
                            <TextBlock Grid.Row="1" Grid.Column="1"
                                       FontSize="12"
                                       FontWeight="Normal"
                                       Foreground="Red"
                                       Text="{Binding  XValue, Converter={StaticResource toStringConverterConverter}}" />
                        </Grid>
                    </DataTemplate>
                </ItemsControl.ItemTemplate>
            </ItemsControl>
        </Border>
Images
  • You must to post comments
0
0

Hi vaquita,

Ok I think you will need to subscribe to the ScichartSurface.MouseLeave event and in the handler, show or hide the ItemsControl which is bound to the SeriesInfo collection (for that chart).

Does this make sense?

e.g.

<!-- XAML -->
<s:SciChartSurface MouseLeave="OnSciChartMouseLeave" MouseEnter="OnSciChartMouseEnter">
    <!-- code omitted for brevity -->
</s:SciChartSurface>

<ItemsControl x:Name="rolloverLegend">
    <!-- code omitted for brevity -->
</ItemsControl>
// Code Behind
private void OnSciChartMouseLeave(object sender, EventArgs e)
{
    rolloverLegend.Visibility = Visibility.Collapsed;
}
private void OnSciChartMouseEnter(object sender, EventArgs e)
{
    rolloverLegend.Visibility = Visibility.Visible;
}

Of course if you have 4 charts you’ll need to manage which chart the mouse is over and hide the appropriate legend. Finally, if the mouse event doesn’t fire, please look into using the AddHandler method to subscribe to events which have already been handled.

Best regards,
Andrew

  • vaquita50
    Thanks so much Andrew..... It did work as I wanted... You guys are really good and It is great that you answer the question so quick... I think my company will definitely buy this product. Have a nice day!!
  • Andrew Burnett-Thompson
    Aww thanks! :) It's one of our core principles, to provide excellent customer service. It's pretty hard work but as a WPF/c# developer whose bought many a component with dodgy support, I know it's appreciated! Kind regards, Andrew
  • You must to post comments
0
0

Another idea – in SciChart v3.1 will feature a property to define when the Rollover Tooltips are shown:

New tooltip trigger mode: ShowTooltipOn.MouseHover – shown in the RolloverFeedback example, used by the rollover in SciStockChart by default

<s:SciChartSurface.ChartModifier>
    <s:ModifierGroup>
        <s:RolloverModifier ShowTooltipOn="MouseHover"/>
    </s:ModifierGroup>
</s:SciChartSurface.ChartModifier>

ShowToolTipOn will support values as follows:

/// 
/// Specifies actions that cause roolover tooltip to be shown
/// 
public enum ShowTooltipOptions
{
    /// 
    /// Show tooltip when mouse is over point
    /// 
    MouseOver,

    /// 
    /// Show tooltip when mouse hovers over the surface
    /// 
    MouseHover,

    /// 
    /// Show tooltip always
    /// 
    Always,

    /// 
    /// Show tooltip when mouse left button is pressed
    /// 
    MouseLeftButtonDown,

    /// 
    /// Show tooltip when mouse right button is pressed
    /// 
    MouseRightButtonDown,

    /// 
    /// Show tooltip when mouse middle button is pressed
    /// 
    MouseMiddleButtonDown
}

So, once v3.1 is released if anyone experiences this problem please give this a try.

Best regards,
Andrew

  • You must to post comments
0
0

I tried this on an OHLC chart and a Candlestick chart using MouseOver. These seem to require the mouse to be over the Closed value. It was my hope that this would fire when the mouse was over any portion of the OHLC bar or Candle. Alternatively, instead of changing the functionality of MouseOver, another Enum value like MouseNear that would accomplish this would be nice.

  • Yuriy Zadereckiy
    Hi Michael, thanks for your suggestion. May I ask, are you talking about RolloverModifier? If so, MouseOver, MouseHover modes are applied to Rollover Markers, not to series bars, as they are in case of TooltipModifier. Do you want to see RolloverTooltips appearing when the mouse cursor is over a series and fading when it goes beyond it?
  • Michael Sage
    Yes – I have multiple charts stacked vertically in one window, and when I roll over an OHLC bar or a Candlestick in my top chart, I want the upper and lower charts to display values such as Volume for the same X date-time position. This currently is working with a rollover modifier, but I am using Mouse Hover and the tool tip style popup shows regardless as to whether I am over an OHLC or Candlestick. Trying to use Mouse Over only worked when I was directly over the Close value and not when I was over any portion of the OHLC bar or Candlestick.
  • You must to post comments
Showing 3 results
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies