This is a migrated thread and some comments may be shown as answers.

PieChart tooltip

6 Answers 358 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
DDD
Top achievements
Rank 1
DDD asked on 16 Dec 2014, 09:48 PM
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?

6 Answers, 1 is accepted

Sort by
0
Peshito
Telerik team
answered on 17 Dec 2014, 12:08 PM
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.

 
0
DDD
Top achievements
Rank 1
answered on 18 Dec 2014, 06:31 PM
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.
0
Peshito
Telerik team
answered on 22 Dec 2014, 11:20 AM
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.

 
0
DDD
Top achievements
Rank 1
answered on 02 Mar 2015, 05:27 PM
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?
0
Peshito
Telerik team
answered on 03 Mar 2015, 01:12 PM
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.

 
0
DDD
Top achievements
Rank 1
answered on 03 Mar 2015, 06:31 PM
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 
Tags
ChartView
Asked by
DDD
Top achievements
Rank 1
Answers by
Peshito
Telerik team
DDD
Top achievements
Rank 1
Share this question
or