We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
close icon

MouseHover Point Value

Hi. I would like to know if it's possible to have the point value displayed when the mouse hovers over a point in a line graph. There are too many points to display the adornment info all the time. I created a DataTemplate for the line with elipses on each point and bound those ellipses to YDataMeasure.Start and YDataNeasure.End, but they don't always display the correct data when you hover over them. Also, it seems to break the chart as most or all of the lines disappear and just the ellipses are displayed. Very odd behavior. Below is the sample of my DataTemplate. There are about 83 data points on the chart so I don't know if that's too many for the DataTemplate to handle or what. Any help appreciated. I am using v1.3.0.8.

Thanks,
Ed



X2="{Binding X2}"
Y1="{Binding Y1}"
Y2="{Binding Y2}"
StrokeThickness="1"
Stroke="{Binding Interior}">


Canvas.Top="{Binding Y2}"
Width="5"
Height="5"
Fill="Transparent"
Stroke="{Binding Interior}" StrokeThickness="0.5">








Canvas.Top="{Binding Y1}"
Width="5"
Height="5"
Fill="Transparent"
Stroke="{Binding Interior}" StrokeThickness="0.5">












8 Replies

AD Administrator Syncfusion Team May 7, 2008 07:32 AM UTC

Hi Ed,

I had a look in to your post. The solution for this would be to use CorrepondingPoints with a converter as following.

XAML Code:




X2="{Binding X2}"
Y1="{Binding Y1}"
Y2="{Binding Y2}"
StrokeThickness="1.5"
Stroke="{Binding Interior}">




Canvas.Top="{Binding Y1}"
Width="5"
Height="5"
Fill="Transparent"
Stroke="{Binding Interior}" StrokeThickness="0.5">










C# Code:

public class ValueConverter : IValueConverter
{
#region IValueConverter Members

public object Convert(object values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
try
{
ChartIndexedDataPoint[] value = (ChartIndexedDataPoint[])values;
return "X = "+ value[0].DataPoint.X.ToString() +", Y = "+ value[0].DataPoint.Y.ToString();
}
catch (Exception ee) { }
return "";
}
public object ConvertBack(object value, Type targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
throw new System.NotImplementedException();
}

#endregion
}

Let me know if you have any queries.

Thanks for your interests in Syncfusion products.

Regards,
Athaur Rahman




AD Administrator Syncfusion Team May 7, 2008 06:03 PM UTC

Thank you so much! I will give it a try.

Thanks,
Ed



AD Administrator Syncfusion Team May 7, 2008 08:10 PM UTC

Okay, one more problem. I am having a real issue with DataTemplates. I have this one for the line graph and I have others for the column and area graphs. The charts work fine without the templates (except the column chart doesn't want to display all the time). Once I apply a template through code the charts don't appear properly. With the line template from the sample above, the elipses will appear, but the lines won't. I took the template down to just basics and the line still doesn't appear. I have posted samples below. Have you seen this problem?

I set the template like this:
chartSeries.Template = (DataTemplate)FindResource("LineTemplate");

Basic template:







Thanks,
Ed




AD Administrator Syncfusion Team May 9, 2008 03:36 AM UTC

Hi Ed,

I have tried applying DataTemplates through C# code and I was not able to reproduce your issue. I applied both the templates which you provided for Line Chart through C# and I was able to see the Chart. I applied the DataTemplates as follows.

C#

chart1.Areas[0].Series[0].Template = this.Resources["LineTemplate"] as DataTemplate;

If you still have the problem. Kindly share the sample with us, so that we will be able help you overcome the issue.

Thanks for your interest in Syncfusion products.

Regards,
Athaur Rahman



AD Administrator Syncfusion Team May 9, 2008 09:35 PM UTC

Thank you so much for all your help. It turns out that the chart didn't like a StackPanel. I had the chart control inside a StackPanel within a Grid column and I guess it didn't like that. I removed the chart from the StackPanel and just placed it in the Grid column by itself and it works wonderfully! The speed was terrible on it before too and now it's blazing. You really do have a great product and thank you for all of your support!

Ed



AD Administrator Syncfusion Team June 25, 2008 09:03 PM UTC

This is pretty slick. It worked really well for a stacking column chart by just attaching the following to the rectangle in the template:






I'm not stuck looking at an area chart and a stacking area chart. How could you display datapoints for those chart types? Ideally, I think I'd like to see something like the ellipses on the line chart but I can't find a way to insert the ellipse at each segment of the chart.

thanks




AD Administrator Syncfusion Team June 30, 2008 09:04 AM UTC


Hi Jon,

Thanks for your interest in Syncfusion products. Template for Area and StackingArea ChartType differs from the Line and Column charts. A path object is used to draw the ChartSeries and so we will not be able to add a ellipse to the line directly. But as a workaround, we can use the SymbolTemplate of the ChartAdornmentInfo class to display an path and on mouse hover, its corresponding value can be displayed in the tooltip.

The following DataTemplates can be used to display a ellipse in the Area type series.

XAML Code:




Data="{Binding Geometry}"
Fill="{Binding Interior}"
Stroke="Black"/>











Margin="0"
Padding="2"
BorderBrush="Black"
Background="Transparent"
BorderThickness="0">











Template="{StaticResource AreaTemplate1}" Data="0 {7 4} 1 {8 3} 2 {9 7} 3 {3 6} 4 {1 2} 5 {8 11} 6 {3 2}"
Type="StackingArea">





C# Code:

//Converter class
public class ValueConverter : IValueConverter
{
#region IValueConverter Members

public object Convert(object values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
try
{
ChartPoint point = (ChartPoint)values;
return "X = " + point.X.ToString() + ", Y = " + point.Y.ToString();
}
catch (Exception ee) { }
return "";
}
public object ConvertBack(object value, Type targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
throw new System.NotImplementedException();
}

#endregion
}


Let me know if you have further queries.

Regards,
Athaur Rahman GS




AD Administrator Syncfusion Team March 11, 2009 09:01 AM UTC

Hi,
I am using stacking area chart. The issue is that in your following code. I'll always get the first value in the corresponding point collection.

ChartIndexedDataPoint[] value = (ChartIndexedDataPoint[])values;
return "X = "+ value[0].DataPoint.X.ToString() +", Y = "+ value[0].DataPoint.Y.ToString();

I want to get the current value according to the mouse's current position.

Thanks

>Hi Ed,

I had a look in to your post. The solution for this would be to use CorrepondingPoints with a converter as following.

XAML Code:




X2="{Binding X2}"
Y1="{Binding Y1}"
Y2="{Binding Y2}"
StrokeThickness="1.5"
Stroke="{Binding Interior}">




Canvas.Top="{Binding Y1}"
Width="5"
Height="5"
Fill="Transparent"
Stroke="{Binding Interior}" StrokeThickness="0.5">










C# Code:

public class ValueConverter : IValueConverter
{
#region IValueConverter Members

public object Convert(object values, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
try
{
ChartIndexedDataPoint[] value = (ChartIndexedDataPoint[])values;
return "X = "+ value[0].DataPoint.X.ToString() +", Y = "+ value[0].DataPoint.Y.ToString();
}
catch (Exception ee) { }
return "";
}
public object ConvertBack(object value, Type targetTypes, object parameter, System.Globalization.CultureInfo culture)
{
throw new System.NotImplementedException();
}

#endregion
}

Let me know if you have any queries.

Thanks for your interests in Syncfusion products.

Regards,
Athaur Rahman





Loader.
Live Chat Icon For mobile
Up arrow icon