How do I set the format of digit group separators for the SfChart chart Tooltip in WPF?

Question

I'm using C# WPF with Syncfusion component

I'm working with SfChart control , here is my chart :

My Chart

I want to set thousand separator string format for my SplineSeries chart

XAML:

 <syncfusion:SfChart Visibility="Visible" Margin="5">
                
                <syncfusion:SfChart.Behaviors>
                    <syncfusion:ChartZoomPanBehavior EnableMouseWheelZooming="True" EnablePinchZooming="True"  EnableZoomingToolBar="True" EnablePanning="True" ZoomRelativeToCursor="True" >
                    </syncfusion:ChartZoomPanBehavior>
                </syncfusion:SfChart.Behaviors>

                <syncfusion:SfChart.PrimaryAxis>
                    <syncfusion:CategoryAxis LabelFormat="#,#"/>
                </syncfusion:SfChart.PrimaryAxis>
                
                <syncfusion:SfChart.SecondaryAxis>
                    <syncfusion:NumericalAxis Header="مبلغ" LabelFormat="#,#" />
                </syncfusion:SfChart.SecondaryAxis>
                
                <chart:SfChart.Legend>
                    <chart:ChartLegend DockPosition="Top" ItemStringFormat="#,#"/>
                </chart:SfChart.Legend>

                
                <syncfusion:SplineSeries  ItemsSource="{Binding PISH_90_DATA}" Label="پیش فاکتور های 90 روزه"  EnableAnimation="True" XBindingPath="DD" YBindingPath="MABL_K"  ShowTooltip="True">
                    <syncfusion:SplineSeries.AdornmentsInfo>
                        <chart:ChartAdornmentInfo  ShowLabel="False" SegmentLabelFormat="#,#">
                        </chart:ChartAdornmentInfo>
                    </syncfusion:SplineSeries.AdornmentsInfo>
                </syncfusion:SplineSeries>

            </syncfusion:SfChart>

document of Tooltip chart : Tooltip in WPF Charts (SfChart) https://help.syncfusion.com/wpf/charts/interactive-features/tooltip

How can I do that ?

Answer 1

You can set digit group separators for the SfChart tooltip by setting the string format for text in the series ToolTipTemplate. Additionally, you can set the styles for the tooltip template path, as shown in the following code snippet.

<chart:SfChart.Resources>

                <Style TargetType="Path" x:Key="style">

                    <Setter Property="Stroke" Value="Black"/>

                    <Setter Property="Fill" Value="White"/>

                    <Setter Property="StrokeThickness" Value="1" />

                </Style>

</chart:SfChart.Resources>

      

<chart:SfChart.Behaviors>

           <chart:ChartTooltipBehavior Style="{StaticResource style}"/>

</chart:SfChart.Behaviors>

 

<chart:SplineSeries.TooltipTemplate>

       <DataTemplate>

             <TextBlock Background="White"

                                   Margin="2"

                                   Text="{Binding Path=Item.Height, StringFormat='{}{0:0,0}'}"

                                   HorizontalAlignment="Right"/>

       </DataTemplate>

</chart:SplineSeries.TooltipTemplate>

 

UG link: https://www.syncfusion.com/kb/10723/how-to-customize-the-tooltip-in-chart