RadCartesianChart -- serie-specific tooltips?

4 posts, 0 answers
  1. Anders
    Anders avatar
    80 posts
    Member since:
    Dec 2010

    Posted 25 Apr 2012 Link to this post

    Hi telerik,

    We are plotting ScatterlineSeries on a RadCartesianChart. Works well.

    However, as we plot several series in same chart, our users request a tooltip with the name of series to distinguish them.

    I've tried to set the TooltipTemplate of the chart in which case I can get the tooltip for *points* and thought I could use that as a workaround and place Curve Name on each point. However, when I try to bind to an 'enriched' Datapoint I get an error as the points in the serie are ScatterDataPoints (though I've tried to add my 'customized' points, see below).

    So I guess I'm missing the point here - or quite a few ;)

    First of all, what is the recommended way of providing a serie-specific text on each curve as a tooltip?

    And if my approach is not to far off, can you see what I do wrong?

    Thanks,

    Anders, Denmark

    itemsSource.Add(new Rap1DDataPoint(valuesX[i], valuesY[i],curve.CurveName));

    public class Rap1DDataPoint : DataPoint
    {
        public string CurveName { get; set; }
     
        public Rap1DDataPoint(double x, double y, string curveName):base(x,y)
        {
            CurveName = curveName;
        }
    }

    var lineSeries = new ScatterLineSeries
                         {
                             ShowLabels = true,
                             ToolTip = legendHeader,
                             Stroke = serieColor,
                             StrokeThickness = 2,
                             //LegendLabel = legendHeader,
                             //SeriesDefinition = splineSeriesDefinition,
                             ItemsSource = itemsSource,
                             XValueBinding = new PropertyNameDataPointBinding("XValue"),
                             YValueBinding = new PropertyNameDataPointBinding("YValue"),
                             PointTemplate = pointTemplate                                   
                         };

  2. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 27 Apr 2012 Link to this post

    Hello Anders,

    We have attached a sample application that demonstrates how you can use the ChartSeries.DisplayName property and bind it in a custom tooltip template to achieve the desired functionality.

    Hope this helps.


    Regards,
    Giuseppe
    the Telerik team

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. Arvind
    Arvind avatar
    11 posts
    Member since:
    Jan 2017

    Posted 07 May Link to this post

    Dear Admin,
    I am binding below PointSeries with collection for XAsix and YAsiX value ,
    we need Tool tip with same  XAsix and YAsiX value 
    I have created tool tip template.
    I used behavior as well ,but in tool tip its not binding the XAsix and YAsiX value
    <telerik:RadCartesianChart.Behaviors>
                                <telerik:ChartPanAndZoomBehavior ZoomMode="Horizontal" PanMode="Horizontal" />
                                <telerik:ChartTooltipBehavior Placement="Top" HorizontalOffset="-6" VerticalOffset="1" />
                            </telerik:RadCartesianChart.Behaviors>

    ChartMapping is the class of my collection which contain XASIX and YASIX property which we need in Point series collection.  

     <DataTemplate x:Key="ToolTipTemplate"  DataType="{x:Type valueObjects:ChartMapping}">
                <Grid>
                    <Grid.Resources>
                        <Style TargetType="TextBlock">
                            <Setter Property="Foreground" Value="White" />
                            <Setter Property="FontFamily" Value="Segoe UI" />
                            <Setter Property="FontSize" Value="11" />
                        </Style>
                    </Grid.Resources>
                    <Path Data="M-1236,-441 L-1180,-441 -1180,-424 -1228,-424 -1230.5,-420 -1233,-424 -1236,-424 z"
                      Stretch="Fill" Fill="#23A0DA" Stroke="White" StrokeThickness="1" />
                    <StackPanel Margin="4,3,4,12" Orientation="Horizontal">
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="{Binding XAsix}" FontSize="21" TextAlignment="Center" Margin="0,-4" />
                            <TextBlock Text="pts" TextAlignment="Center" Margin="0,-2,0,0" />
                        </StackPanel>
                        <Rectangle Width="1" Fill="White" Margin="3,-3" />
                        <StackPanel Orientation="Vertical" Margin="0,4,0,0">
                            <TextBlock>
                            <Run Text="FINAL POS:" />
                            <Run Text="{Binding Path= XAsix}" />
                            </TextBlock>
                            <TextBlock>
                            <Run Text="GOAL DIFF:" />
                            <Run Text="{Binding Path= YAsixValue}" />
                            </TextBlock>
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </DataTemplate>


     <telerik:PointSeries x:Name="DataSeries"  
     ItemsSource="{Binding ChartMappingCollection, Mode=TwoWay}" ToolTipTemplate={staticresource ToolTipTemplate>

                                <telerik:PointSeries.PointTemplates>
                                    <DataTemplate>
                                        <Ellipse Width="5" Height="5" Fill="Red"/>
                                    </DataTemplate>
                                </telerik:PointSeries.PointTemplates>
                                <telerik:PointSeries.ValueBinding>
                                    <telerik:PropertyNameDataPointBinding PropertyName="XAsix" />
                                </telerik:PointSeries.ValueBinding>
                                <telerik:PointSeries.CategoryBinding >
                                    <telerik:PropertyNameDataPointBinding PropertyName="YAsixValue"  />
                                </telerik:PointSeries.CategoryBinding>
                            </telerik:PointSeries>
                        </telerik:RadCartesianChart>

     

    Please provide any help .

    Thank You !

  4. Arvind
    Arvind avatar
    11 posts
    Member since:
    Jan 2017

    Posted 08 May in reply to Arvind Link to this post

    I Fixed this issue .

     

    Thank You !

     

Back to Top