User Interactions in UWP Smith Chart (SfSmithChart)

18 Nov 20183 minutes to read

Tooltip

The ToolTip for data points can be enabled by setting the ShowToolTip property as True. ToolTip displays for the duration that is defined by the ToolTipDuration property.

<syncfusion:SfSmithChart x:Name="SmithChart">
    <syncfusion:LineSeries ShowToolTip="True" ToolTipDuration="0:0:3">
    </syncfusion:LineSeries>
</syncfusion:SfSmithChart>
LineSeries series = new LineSeries();
series.ShowToolTip = true;
series.ToolTipDuration = TimeSpan.FromSeconds(3);
chart.Series.Add(series);

SfSmithChart ToolTip

ToolTipTemplate

The ToolTipTemplate property allows customizing the default appearance of the tooltip as illustrated in the below code example.

<syncfusion:SfSmithChart x:Name="SmithChart">
    <syncfusion:SfSmithChart.Resources>
    <DataTemplate x:Key="toolTipTemplate">
        <Border CornerRadius="4" Background="{Binding Interior}" BorderBrush="Yellow" BorderThickness="2">
            <Grid HorizontalAlignment="Center" Margin="8,8,8,8">
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Row="0" Grid.Column="0" Text="Resistance" Foreground="{Binding ForeColor}" FontSize="13" />
                <TextBlock Grid.Row="0" Grid.Column="1" Text=" : " Foreground="{Binding ForeColor}" FontSize="13" Margin="0,-1,0,0" />
                <TextBlock Grid.Row="0" Grid.Column="2" Text="{Binding Resistance}" Foreground="{Binding ForeColor}" FontSize="13" Margin="3,0,0,0" />
                <TextBlock Grid.Row="1" Grid.Column="0" Text="Reactance" Foreground="{Binding ForeColor}" FontSize="13" />
                <TextBlock Grid.Row="1" Grid.Column="1" Text=" : " Foreground="{Binding ForeColor}" FontSize="13" Margin="0,-1,0,0" />
                <TextBlock Grid.Row="1" Grid.Column="2" Text="{Binding Reactance}" Margin="3,0,0,0" Foreground="{Binding ForeColor}" FontSize="13" />
            </Grid>
        </Border>
    </DataTemplate>
    </syncfusion:SfSmithChart.Resources>

    <syncfusion:LineSeries ShowToolTip="True" ToolTipTemplate="{StaticResource toolTipTemplate}" ShowMarker="True" MarkerType="Custom" MarkerTemplate="{StaticResource Ellipse}" ItemsSource="{Binding Data}" ResistancePath="Resistance" ReactancePath="Reactance" />

 </syncfusion:SfSmithChart>
LineSeries series = new LineSeries();
series.ShowToolTip = true;
series.ToolTipTemplate = this.Grid1.Resources["toolTipTemplate"] as DataTemplate;
chart.Series.Add(series);

SfSmithChart ToolTipTemplate