PieChart tooltip

7 posts, 0 answers
  1. DDD
    DDD avatar
    5 posts
    Member since:
    Dec 2014

    Posted 16 Dec 2014 Link to this post

    Hey,
    I've been trying to create a tooltip for a PieDataPoint, but had a couple of difficulties.
    Basically, I would like to use the standard tooltip, but I could only find examples showing overriding the tooltip template for this cause. So I tried to create a similar template myself - which caused some bugs.
    Mainly, I couldn't get the tooltip size to change according the content (like the strings lengths in the texblocks, I guess it'll be clearer in the xaml).
    Another bug (I Believe it's another symptom of the same bug) - inside the tooltip I used a GridRows with Auto height. It seems like it calculates the row's height correctly only the second time it shows the tooltip.

    This is the xaml:
    <telerik:RadPieChart Palette="Windows8" Grid.Column="0" Name="PieChart">
        <telerik:PieSeries ValueBinding="Value"
                            ShowLabels="True"
                            RadiusFactor="0.6"
                            IsHitTestVisible="True"
                            ItemsSource="{Binding PieData}">
     
                            <telerik:PieSeries.LabelDefinitions>
                                <telerik:ChartSeriesLabelDefinition Margin="-10,0,0,0" Binding="Label" HorizontalAlignment="Center"/>
                            </telerik:PieSeries.LabelDefinitions>
                            <telerik:PieSeries.LegendSettings>
                                <telerik:DataPointLegendsSettings TitleBinding="Legend"/>
                            </telerik:PieSeries.LegendSettings>
                            <telerik:PieSeries.AngleRange>
                                <telerik:AngleRange StartAngle="270" SweepAngle="360"/>
                            </telerik:PieSeries.AngleRange>
                            <telerik:PieSeries.LabelConnectosSettings>
                                <telerik:ChartSeriesLabelConnectorsSettings/>
                            </telerik:PieSeries.LabelConnectosSettings>
        </telerik:PieSeries>
     
        <telerik:RadPieChart.Behaviors>
            <telerik:ChartTooltipBehavior/>
        </telerik:RadPieChart.Behaviors>
     
        <telerik:RadPieChart.SmartLabelsStrategy>
            <telerik:PieChartSmartLabelsStrategy DisplayMode="SpiderUnaligned"/>
        </telerik:RadPieChart.SmartLabelsStrategy>
     
        <telerik:RadPieChart.TooltipTemplate>
            <DataTemplate>
                <Border BorderBrush="#FFA0AFC3" BorderThickness="1">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FFFDFEFF" Offset="0"/>
                                <GradientStop Color="#FFDDE9F7" Offset="1"/>
                            </LinearGradientBrush>
                        </Grid.Background>
     
                        <TextBlock Text="{Binding DataItem.ToolTipTitle}" Grid.Row="0" Opacity="0.56" FontSize="13" HorizontalAlignment="Left" MaxWidth="340" FontWeight="Bold" TextWrapping="Wrap"/>
                        <TextBlock Text="{Binding DataItem.ToolTipContent}" Grid.Row="1" FontSize="12" HorizontalAlignment="Left" MaxWidth="340" TextWrapping="Wrap"/>
                    </Grid>
                </Border>
            </DataTemplate>
        </telerik:RadPieChart.TooltipTemplate>
    </telerik:RadPieChart>

    Is there any way to use WPF default tooltip? If not, What am I doing wrong?
  2. Peshito
    Admin
    Peshito avatar
    497 posts

    Posted 17 Dec 2014 Link to this post

    Hi,

    The user has full control over the visualization of the tooltip itself and over the information that the tooltip will display.

    I prepared a sample project using the code you shared. The width of the tooltip changed in accordance of  the tooltip message length. Could you elaborate a bit more on the issue you experience.

    Please find attached the sample I worked on showing two approaches for setting a ToolTip. The first one is by using ToolTipTemplate and the second one by using RadToolTipContentView control. Simply take a look at the MainWindow.xaml file for more details.

    Hope this helps.

    Regards,
    Peshito
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for WPF is Visual Studio 2017 Ready
  4. DDD
    DDD avatar
    5 posts
    Member since:
    Dec 2014

    Posted 18 Dec 2014 in reply to Peshito Link to this post

    The sample worked fine, but I still had the width issue in my project, using the same xaml.
    I attached 2 images that illustrates the problem.
  5. Peshito
    Admin
    Peshito avatar
    497 posts

    Posted 22 Dec 2014 Link to this post

    Hi,

    As mentioned earlier, the user has control over the visualization of the tooltip. Hence, depending on the DataTemplate you have used, the result will vary. I wasn't able to reproduce the width issue and I will need a sample project in order to be able to provide you with a possible solution. You can send us a modified version of the one attached earlier in my previous answer, or send us a sample runnable copy of yours. As this is a forum thread, I suggest you to upload and share the sample using a third party web site for file sharing.

    Regards,
    Peshito
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. DDD
    DDD avatar
    5 posts
    Member since:
    Dec 2014

    Posted 02 Mar 2015 Link to this post

    Hey,
    sorry for the (very) long delay, I've been asked to work on some other issues.

    I'm still having the same problem though..
    We're using both RadPieChart and RadCartesianChart in our project, and the cartesian's tooltip seems to work just fine (using the same DataTemplate). Also, when trying to recreate the bug on a side project, containing only the PieChart (same code and xaml)- it works okay.
    The Project itself is very large and stored in an internal network, so I can't really upload it..

    Any idea what could possibly cause this?
  7. Peshito
    Admin
    Peshito avatar
    497 posts

    Posted 03 Mar 2015 Link to this post

    Hi,

    This sounds strange indeed. There should be no difference in the way the tooltip behaves no matter whether the chart is Cartesian or Pie one. Unfortunately, unless being able to reproduce the issue it is really hard to guess what might be causing it. We actually do not need the real project you are working on, but the one that simply points out and isolates the issue.

    You will find the following blog post helpful in finding what steps to perform in order to isolate an issue. Even though it is from the ASP.NET AJAX Team, it is valid for WPF as well.
    http://blogs.telerik.com/aspnet-ajax/posts/10-09-29/isolating-a-problem-in-a-sample-project.aspx

    Regards,
    Peshito
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  8. DDD
    DDD avatar
    5 posts
    Member since:
    Dec 2014

    Posted 03 Mar 2015 in reply to Peshito Link to this post

    Well, I still don't know what the issue is, but I managed to overcome the display problem by calling the DataTemplate's border UpdateLayout method when it appears. It seems to be working now 
Back to Top
UI for WPF is Visual Studio 2017 Ready