XAML-DataGridTemplateColumn中的折线图 [英] XAML - Line Chart in DataGridTemplateColumn
问题描述
我遇到的问题如下:
我有一个DataGrid表，其中的行和列绑定到List< DataStructure>.其中DataStructure具有名称，MinVal，MaxVal，TodayVal.
2.在我的DataGrid中，我需要显示所有数据值的图表/图形，以获取数据点列表.例如，如果X的等级为78.5、45.5、100、94.5 .... etc，则MinVal，MaxVal和TodayVal基于此数据点列表.图形/图表显示了从第1天到今天的进度.
3.图表必须适合数据网格的行/列-(否:边框，图例，x/y轴，标题...等).必须对图表/图形进行拉伸或缩放，以使其完全适合datagrid单元(起点左对齐，端点右对齐).
Hi,
The problem I has is follows:
1. I have a DataGrid table with rows and columns bound to a List<DataStructure> where the DataStructure has Name, MinVal, MaxVal, TodayVal.
2. In my DataGrid, I need to display a chart/graph of all the data values for a list of data points. For example, if X has grades of 78.5, 45.5, 100, 94.5.....etc, the MinVal, MaxVal and TodayVal are based on this list of data points. The graph/chart shows the progress starting wih day1 through to today.
3. The chart has to fit in the datagrid row/column - (no: borders, legends, x/y axis, title....etc). The chart/graph has to be stretched or scaled such that it fits perfectly in the datagrid cell (startpoint left aligned, endpoint is rightaligned).
<dg:DataGridTemplateColumn x:Name="GRADES" Header="GRADE Chart" IsReadOnly="True" Width="83">
<dg:DataGridTemplateColumn.CellTemplate>
<DataTemplate x:Name="DAILYGRIDTEMPATE">
<Grid Width="83" ClipToBounds="False">
<Canvas Margin="0" ClipToBounds="False" Background="Transparent">
<Polyline Points="{Binding GRADES}"
Stroke="Blue"
StrokeThickness="1"
ClipToBounds="False"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Stretch="Uniform"/>
</Canvas>
</Grid>
</DataTemplate>
</dg:DataGridTemplateColumn.CellTemplate>
</dg:DataGridTemplateColumn>
我的DataStructure包含折线点集合的以下属性(类= rowModel)
My DataStructure contains the following property for the polyline pointcollections (Class = rowModel)
// GradeChart - Point Collection
public PointCollection _grades;
public PointCollection GRADES
{
get { return _grades; }
set
{
_grades= value;
OnPropertyChanged("GRADES");
}
}
我的代码通过以下内容填充XAML/WPF(其中points = List< double> {76.3、56.2、96.4 ... etc}):
My code populates the XAML/WPF by the following (where points = List<double> {76.3, 56.2, 96.4...etc}):
PointCollection pc = new PointCollection();
for (int i = 0; i < points.Count; i++)
{
pc.Add(new Point(i, (double)points[i]*10));
Debug.WriteLine(className + ": paintIntradayChart [" + i + ", " + (double)points[i] + "]");
}
pc.Freeze();
rowModel.GRADES= pc;
现在一切正常，我可以在数据单元中设置图表/图形....实际上，如果需要的话，我也可以在当天进行此更新，因为我要做的就是在pointcollection中添加一个点，将其冻结，然后将其设置为GRADES属性以反映变化.
我需要做的是解决以下我正在努力解决的问题:
折线的X/Y坐标应类似于图表(X->右，Y->上)....下
2.缩放画布中的折线-需要使其完全适合网格->帆布
将不胜感激.请提供代码片段，因为我是初次接触.NET的人，不但可以提供指导性的指导，而且还可以提供指导性的指导.
谢谢，
Manish
Now this all works fine and I can set my chart/graph in the datacell....in fact, I can also have this update intraday if required as all I have to do is add a point to the pointcollection, freeze it and then set it to the GRADES property to reflect the chanege.
What I need to do fix the following which I am sort of struggling with:
1. X/Y coordinates of the Polyline should be like a chart (X -> right, Y -> Up)....currently Y -> Down
2. Scaling of the Polyline in the Canvas - need it to fit perfectly in the Grid -> Canvas
Would appreciate any help. Please provide code snippets as I am new to learning .NET an would appreciate illustrative guidance rather than just general direction.
Thanks,
Manish
推荐答案
1)Y下降了，这就是事实，您应该能够轻松地容纳它，这是您要做的所有事情''已经计算出Y为y = 0-y.
2)您可以使用 ScaleTransform [
1) Y is down and that''s just the way it is, you should be able to accommodate that easily, all you need to do when you''ve calculated Y isy = 0-y.
2) You can use ScaleTransform[^] for this, there are examples at the bottom of the page.
这篇关于XAML-DataGridTemplateColumn中的折线图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
