Pre loader

How to customize the tooltip in the mode of CursorModifier

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

Answered
0
1

Please see the attached screen snapshot. My apps is based on the example ScriTrader. I have about 30 series on the chart. In the CursorModifier mode. I want to customize the tooltip to achieve:

1) only the FastCandlestickRenderableSeries shows the tooltip
2) the string format is 0.00000 instead of the default value 0.000
3) other series won’t whow tooltip

Images
  • You must to post comments
Best Answer
1
0

Update: SciChart v4

The SciChart v4 Documentation now has a topic on styling the CursorModifier Tooltips, Lines and Axis Labels. You can see this here:

> How to style the CursorModifier Tooltips

Also, you can learn how to style the CursorModifier Tooltips and Axis Labels in the following example:

> Styling CursorModifier Tooltips WPF Chart Example

enter image description here

  • You must to post comments
1
0

Hi there,

Thanks for your inquiry. Actually, to show a tooltip for the Ohlc series, you could set IsSelected to “True” on the series and SourceMode to “SelectedSeries” on the Cursor modifier. Or you could override the IsSeriesValid method and return “True” for the FastCandlestickRenderableSeries only.

Unfortunately, the string format is hard-coded in the default style, so you should create a new DataTemplate for Ohlc data and apply it via SeriesInfoTemplateSelector, also setting templates for other series types to an empty DataTemplate. FYI, we improved this behavior in the newest v3.2 build (internal) and it will be possible to change string format setting the CursorTextFormatting property or a LabelProvider on an axis.

Please take a look at the xaml piece below and let us know if it has the desired behavior:

<UserControl x:Class="Abt.Controls.SciChart.Example.Examples.IWantTo.CreateMultiseriesChart.CandlestickWithLinesView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         xmlns:s="http://schemas.abtsoftware.co.uk/scichart"
         xmlns:markupExtensions="clr-namespace:Abt.Controls.SciChart.Common.MarkupExtensions;assembly=Abt.Controls.SciChart.Wpf"
         d:DesignHeight="300"
         d:DesignWidth="300"
         Loaded="CandlesticksWithLines_Loaded"
         mc:Ignorable="d">

<UserControl.Resources>

    <!-- The style for TextBlocks appearing in a tooltip -->
    <Style x:Key="HintDataItemsStyle" TargetType="TextBlock">
        <Setter Property="Foreground" Value="{markupExtensions:ThemeBinding Path=CursorLabelForeground}" />
        <Setter Property="FontWeight" Value="Bold" />
        <Setter Property="FontFamily" Value="Arial" />
        <Setter Property="FontSize" Value="13" />
        <Setter Property="Margin" Value="3,2,2,2" />
    </Style>

    <!-- The template, which determines appearance of the tooltip for Ohcl data -->
    <DataTemplate x:Key="OhlcSeriesRolloverLabelTemplate" DataType="s:OhlcSeriesInfo">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>

            <TextBlock Grid.ColumnSpan="2"
                   HorizontalAlignment="Left"
                   Style="{StaticResource HintDataItemsStyle}"
                   Text="{Binding SeriesName}" />

            <StackPanel Grid.Row="1">
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="Open" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="Highest" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="Lowest" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="Close" />
            </StackPanel>

            <StackPanel Grid.Row="1" Grid.Column="1">
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="{Binding OpenValue,
                                      StringFormat=\{0:0.0000\}}" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="{Binding HighValue,
                                      StringFormat=\{0:0.0000\}}" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="{Binding LowValue,
                                      StringFormat=\{0:0.0000\}}" />
                <TextBlock HorizontalAlignment="Left"
                       Style="{StaticResource HintDataItemsStyle}"
                       Text="{Binding CloseValue,
                                      StringFormat=\{0:0.0000\}}" />
            </StackPanel>
        </Grid>
        </DataTemplate>

    <!-- Empty data template for other series -->
    <DataTemplate x:Key="EmptyTemplate" />

    <!-- the TemplateSelector for the CursorModifier below -->
    <s:SeriesInfoTemplateSelector x:Key="OhlcSeriesInfoTemplateSelector" 
                                  DefaultTemplate="{StaticResource EmptyTemplate}" 
                                  OhlcSeriesTemplate="{StaticResource OhlcSeriesRolloverLabelTemplate}" />

</UserControl.Resources>

<s:SciChartSurface x:Name="sciChart" s:ThemeManager.Theme="Chrome">

    <s:SciChartSurface.RenderableSeries>
        <!-- Candlestick bodies now support gradients as well as solid colours -->
        <s:FastCandlestickRenderableSeries>
            <s:FastCandlestickRenderableSeries.UpBodyBrush>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                    <GradientStop Offset="0" Color="#55002200" />
                    <GradientStop Offset="1" Color="#FF00AA00" />
                </LinearGradientBrush>
            </s:FastCandlestickRenderableSeries.UpBodyBrush>
            <s:FastCandlestickRenderableSeries.DownBodyBrush>
                <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                    <GradientStop Offset="0" Color="#55441111" />
                    <GradientStop Offset="1" Color="#FFFF0000" />
                </LinearGradientBrush>
            </s:FastCandlestickRenderableSeries.DownBodyBrush>
        </s:FastCandlestickRenderableSeries>
        <s:FastLineRenderableSeries SeriesColor="#FF1919" />
        <s:FastLineRenderableSeries SeriesColor="#1964FF" />
        <s:FastLineRenderableSeries SeriesColor="#FF9B27" />
    </s:SciChartSurface.RenderableSeries>

    <s:SciChartSurface.XAxis>
        <s:CategoryDateTimeAxis GrowBy="0.0, 0.2" />
    </s:SciChartSurface.XAxis>

    <s:SciChartSurface.YAxis>
        <s:NumericAxis GrowBy="0.1, 0.1" />
    </s:SciChartSurface.YAxis>


    <s:SciChartSurface.ChartModifier>
        <s:ModifierGroup>
            <s:CursorModifier ShowTooltip="True" TooltipLabelTemplateSelector="{StaticResource OhlcSeriesInfoTemplateSelector}"/>
        </s:ModifierGroup>
    </s:SciChartSurface.ChartModifier>

</s:SciChartSurface>

Best regards,
Yuriy

  • chunxi
    This solved my problem. Many thanks Yuriy!
  • RTrade A
    Yuriy, In SeriesInfoTemplateSelector what is the name for template for FastColumnRenderableSeries? Now I have to create DataTemplate for it with XySeriesInfo DataType and set in TemplateSelector to DefaultTemplate.
    • Guest
    • 9 years ago
    • 1
    Hi, DefaultTemplate is used for FastColumnRenderableSeries. You should inherit SeriesInfoTemplateSelector, define your own property and check for FastColumnRenderableSeries in the SelectTemplate method override, returning appropriate DataTemplate. Does it make sense?
  • You must to post comments
Showing 2 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