I have a LineChart and currently my marker is done like the following:
<!-- Markers Point --><DataTemplate DataType="{x:Type igCA:MarkerTemplate}"> <Ellipse Stroke="{Binding Path=Stroke}" Fill="{Binding Path=Fill}" Width="12" Height="12" /></DataTemplate><igCA:Series.Marker> <igCA:Marker UseDataTemplate="True" Foreground="#FF686868" FontFamily="Verdana" FontSize="14" LabelDistance="5"/></igCA:Series.Marker>
Is there a way to add a Mouse enter event handler so I can place a pop-up label with the given information (Label and Value) of the corresponding point?
Thanks all.
Anyone?????
Something like this would be one way to approach things:The Xaml:
<Window.Resources> <!-- Markers Point --> <DataTemplate DataType="{x:Type igChart:MarkerTemplate}"> <Ellipse Stroke="{Binding Path=Stroke}" Fill="{Binding Path=Fill}" Width="12" Height="12" ToolTip="{Binding Path=ToolTip}"/> </DataTemplate> <local:TestData x:Key="data" /> <DataTemplate x:Key="chartTooltip1"> <StackPanel> <StackPanel Orientation="Horizontal" > <TextBlock Text="Label: "/> <TextBlock Text="{Binding Label}" Foreground="Blue"/> </StackPanel> <StackPanel Orientation="Horizontal" > <TextBlock Text="Value: "/> <TextBlock Text="{Binding Value}" Foreground="Blue"/> </StackPanel> </StackPanel> </DataTemplate> </Window.Resources> <Grid> <igChart:XamChart> <igChart:XamChart.Series> <igChart:Series ChartType="Line" DataSource="{StaticResource data}" DataMapping="Label = Label; Value = Value; Tooltip = Tooltip"> <igChart:Series.Marker> <igChart:Marker UseDataTemplate="True" Foreground="#FF686868" FontFamily="Verdana" FontSize="14" LabelDistance="5"/> </igChart:Series.Marker> </igChart:Series> </igChart:XamChart.Series> </igChart:XamChart> </Grid>
And the code behind:
public partial class Window1 : Window { public Window1() { InitializeComponent(); Application.Current .Resources.Add("chartTooltip1", Resources["chartTooltip1"]); } } public class TestData : ObservableCollection<TestDataItem> { public TestData() { this.Add(new TestDataItem() { Label = "1", Value = 1 }); this.Add(new TestDataItem() { Label = "2", Value = 2 }); this.Add(new TestDataItem() { Label = "3", Value = 3 }); this.Add(new TestDataItem() { Label = "4", Value = 4 }); this.Add(new TestDataItem() { Label = "5", Value = 5 }); } } public class TestDataItem { private DataTemplate Template { get; set; } public string Label { get; set; } public double Value { get; set; } public object Tooltip { get { if (Template == null) { Template = Application.Current .Resources["chartTooltip1"] as DataTemplate; } if (Template != null) { return new ContentControl() { Content = this, ContentTemplate = Template }; } else { return "Label: " + Label + ", Value: " + Value.ToString(); } } } }
Let me know if this helps!-Graham
I don't think this does exactly what I want. Let's say for example:
When my mouse is over DataPoint[0] I want the label to display DataPoint[0]. Label, DataPoint[0]. Value
I don't want to display all the DataPoint's just the one my mouse it over.
That is what this does, unless I'm misunderstanding what you are asking for.
-Graham