Hello,
I searched for sample projects but I can not adapt them to my graph. When I adapted them, just nothing happened. Here my xaml and code behind;
<ig:XamDataChart Name="xamDataChart1" HorizontalZoomable="True" HorizontalZoombarVisibility="Visible" VerticalZoomable="False" Margin="0,0,0,0" Legend="{Binding ElementName=xmLegend}"> <ig:SyncManager.SyncSettings> <ig:SyncSettings SyncChannel="Group1" SynchronizeHorizontally="True" SynchronizeVertically="False" /> </ig:SyncManager.SyncSettings> <ig:XamDataChart.Axes> <ig:CategoryDateTimeXAxis x:Name="xAxis" DateTimeMemberPath="TARIH" Interval="1"> <ig:CategoryDateTimeXAxis.LabelSettings> <ig:AxisLabelSettings Location="OutsideBottom" Extent="40" Angle="270" /> </ig:CategoryDateTimeXAxis.LabelSettings> <ig:CategoryDateTimeXAxis.Label> <DataTemplate> <TextBlock Text="{Binding Item.Date, StringFormat={}{0:d.MM} }" Margin="-25,0,0,0" FontSize="10" /> </DataTemplate> </ig:CategoryDateTimeXAxis.Label> <ig:CategoryDateTimeXAxis.Style> <Style TargetType="ig:Axis"> <Setter Property="MajorStrokeThickness" Value="0"/> </Style> </ig:CategoryDateTimeXAxis.Style> </ig:CategoryDateTimeXAxis> <ig:NumericYAxis x:Name="yAxis" Label="{}{0:P}"> <ig:NumericYAxis.LabelSettings> <ig:AxisLabelSettings Location="InsideLeft" /> </ig:NumericYAxis.LabelSettings> <ig:NumericYAxis.Style> <Style TargetType="ig:Axis"> <Setter Property="MajorStrokeThickness" Value="0"/> </Style> </ig:NumericYAxis.Style> </ig:NumericYAxis> <ig:NumericYAxis x:Name="yAxisVol"> <ig:NumericYAxis.LabelSettings> <ig:AxisLabelSettings Location="InsideRight" /> </ig:NumericYAxis.LabelSettings> <ig:NumericYAxis.Style> <Style TargetType="ig:Axis"> <Setter Property="MajorStrokeThickness" Value="0"/> </Style> </ig:NumericYAxis.Style> </ig:NumericYAxis> </ig:XamDataChart.Axes> </ig:XamDataChart>
HorizontalZoomable="True"
HorizontalZoombarVisibility="Visible"
VerticalZoomable="False"
Margin="0,0,0,0"
Legend="{Binding ElementName=xmLegend}">
<ig:SyncManager.SyncSettings>
<ig:SyncSettings SyncChannel="Group1"
SynchronizeHorizontally="True"
SynchronizeVertically="False" />
</ig:SyncManager.SyncSettings>
<ig:XamDataChart.Axes>
<ig:CategoryDateTimeXAxis x:Name="xAxis" DateTimeMemberPath="TARIH" Interval="1">
<ig:CategoryDateTimeXAxis.LabelSettings>
<ig:AxisLabelSettings Location="OutsideBottom" Extent="40" Angle="270" />
</ig:CategoryDateTimeXAxis.LabelSettings>
<ig:CategoryDateTimeXAxis.Label>
<DataTemplate>
<TextBlock Text="{Binding Item.Date, StringFormat={}{0:d.MM} }" Margin="-25,0,0,0" FontSize="10" />
</DataTemplate>
</ig:CategoryDateTimeXAxis.Label>
<ig:CategoryDateTimeXAxis.Style>
<Style TargetType="ig:Axis">
<Setter Property="MajorStrokeThickness" Value="0"/>
</Style>
</ig:CategoryDateTimeXAxis.Style>
</ig:CategoryDateTimeXAxis>
<ig:NumericYAxis x:Name="yAxis" Label="{}{0:P}">
<ig:NumericYAxis.LabelSettings>
<ig:AxisLabelSettings Location="InsideLeft" />
</ig:NumericYAxis.LabelSettings>
<ig:NumericYAxis.Style>
</ig:NumericYAxis.Style>
</ig:NumericYAxis>
<ig:NumericYAxis x:Name="yAxisVol">
<ig:AxisLabelSettings Location="InsideRight" />
</ig:XamDataChart.Axes>
</ig:XamDataChart>
LineSeries lineSeri = new LineSeries(); lineSeri.ItemsSource = each.DefaultView; lineSeri.ValueMemberPath = "CHANGE"; lineSeri.XAxis = xAxis; lineSeri.YAxis = yAxis; lineSeri.Title = each.Rows[0]["TEST"].ToString(); lineSeri.Thickness = 3.0; xamDataChart1.Series.Add(lineSeri);
LineSeries lineSeri = new LineSeries();
lineSeri.ItemsSource = each.DefaultView;
lineSeri.ValueMemberPath = "CHANGE";
lineSeri.XAxis = xAxis;
lineSeri.YAxis = yAxis;
lineSeri.Title = each.Rows[0]["TEST"].ToString();
lineSeri.Thickness = 3.0;
xamDataChart1.Series.Add(lineSeri);
So I am trying to add tooltip with adding the below code below to my xaml that I wrote above;
<ig:XamDataChart.Series> <ig:LineSeries Name="lineSeri" ItemsSource="{Binding}" ValueMemberPath="CHANGE" XAxis="{Binding ElementName=xAxis}" YAxis="{Binding ElementName=yAxis}"> <ig:LineSeries.ToolTip> <StackPanel> <TextBlock Text="sadsa" /> <Grid> <Grid.RowDefinitions> <RowDefinition /> <RowDefinition /> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition /> <ColumnDefinition /> </Grid.ColumnDefinitions> <TextBlock Text="Date:" FontWeight="Bold" Grid.Row="0" Grid.Column="0" /> <TextBlock Text="sdfdsfd" Grid.Row="0" Grid.Column="1" /> <TextBlock Text="Sales:" FontWeight="Bold" Grid.Row="1" Grid.Column="0" /> <TextBlock Text="fgfdgfd" Grid.Row="1" Grid.Column="1" /> </Grid> </StackPanel> </ig:LineSeries.ToolTip> </ig:LineSeries> </ig:XamDataChart.Series>
<ig:XamDataChart.Series>
<ig:LineSeries Name="lineSeri"
ItemsSource="{Binding}"
ValueMemberPath="CHANGE"
XAxis="{Binding ElementName=xAxis}"
<ig:LineSeries.ToolTip>
<StackPanel>
<TextBlock Text="sadsa" />
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Text="Date:" FontWeight="Bold" Grid.Row="0" Grid.Column="0" />
<TextBlock Text="sdfdsfd" Grid.Row="0" Grid.Column="1" />
<TextBlock Text="Sales:" FontWeight="Bold" Grid.Row="1" Grid.Column="0" />
<TextBlock Text="fgfdgfd" Grid.Row="1" Grid.Column="1" />
</Grid>
</StackPanel>
</ig:LineSeries.ToolTip>
</ig:LineSeries>
</ig:XamDataChart.Series>
But as I said nothing happens when mouse over on graph
I am waiting for your replies
Thanks
I am just checking the progress of this issue and was wondering if you managed to achieve your goal or if you need any further assistance on the matter.
Hello Stefan,
Thanks for your reply. My problem is that I have multiple lineseries.
Below you can see the code behind.
In your sample you set ItemSource and valueMemberPath as Oil but I am not sure what to set as ItemSource and ValueMemberPath because I have multi lineseries that I am adding to xamDataChart like in the code below.
How you got an idea?
<ig:XamDataChart.Series> <ig:LineSeries Name="lineSeri" ItemsSource="{Binding}" ValueMemberPath="Oil" XAxis="{Binding ElementName=xAxis}" YAxis="{Binding ElementName=yAxis}">
ValueMemberPath="Oil"
YAxis="{Binding ElementName=yAxis}">
foreach (DataTable each in _vm.Stocks) { LineSeries lineSeri = new LineSeries(); lineSeri.ItemsSource = each.DefaultView; lineSeri.ValueMemberPath = _vm.ChartYAxisValueMemberPath; lineSeri.XAxis = xAxis; lineSeri.YAxis = yAxis; lineSeri.Title = each.Rows[0]["STOCK"].ToString(); lineSeri.Thickness = 3.0; xamDataChart1.Series.Add(lineSeri); }
foreach (DataTable each in _vm.Stocks)
{
lineSeri.ValueMemberPath = _vm.ChartYAxisValueMemberPath;
lineSeri.Title = each.Rows[0]["STOCK"].ToString();
}
If you want to show multiple Series, I can suggest you use one CategoryXAxis and the DataTable, you set as its ItemsSource, should has different Columns and each Column should be set as ValueMemberPath to the different Series. Another approach is to use different CategoryXAxis with different Tables as ItemsSource and set them to the different Series.
Hope this helps you.
Hi Stefan,
Your example is good. However, I would like to know how to display multiple series' data in the box in case of multiple series.
In details, it would be like this:
1. I have multiple series displayed in the chart (ScatterLineSeries type only)
2. I have a popup (like tooltip, I got an example of that popup in this forum) displaying the series' name, its X and Y data when I am hovering cursors on the series. It is currently displaying only one particular series.
This is what I would like to do:
If I am hovering the cursor on any one of series, I would like to display all the data of each series in one box.
However, I don't know how to do it yet. Could you please help me with this?
Sincerely,
Khanh
Hello Khanh,
Could you please send me an isolated sample project, where you have implemented the XamDatachart with multiple Series, so I can be able to think of a possible solution for you, because I cannot be completely sure how you organized your data and connected it to the chart.
Looking forward for your reply.