折线图的绘制

折线图的绘制

折线图的绘制：折线图的绘制有很多中方法，很多平台都提供了相应的类库，我这里就简介两种类库的简单使用(OxyPlot、DynamicDataDisplay)。当然也可以不依赖类库，自定义画图类，完成这一绘图工作。如有需要请参考博客“自定义类绘制折线图”。

• OxyPlot下载
• OxyPlot使用说明
• DynamicDataDisplay下载
• DynamicDataDisplay使用说明
• Demo下载

---

OxyPlot下载

OxyPlot 是 一个 .NET 跨平台的绘图组件。点击下载库文件。

OxyPlot使用说明

布局参考，使用之前记得导入 xmlns:oxy=”http://oxyplot.org/wpf”。

<oxy:Plot x:Name="myPlot" Margin="0,0,0,162"   >  
        <oxy:Plot.Axes>
            <oxy:LinearAxis x:Name="plotY"  Position="Left" MajorGridlineStyle="Solid" MinorGridlineStyle="Dot" TickStyle="None"   Maximum="50" MajorStep="10" />
            <oxy:LinearAxis x:Name="plotX" Position="Bottom"   MajorGridlineStyle="Solid" MinorGridlineStyle="Dot"  TickStyle="None" Maximum="60"  MajorStep="10"/>
            </oxy:Plot.Axes  >
            <oxy:LineSeries x:Name="plotTemp" Color="Red" ItemsSource="{Binding TempData}"/>
</oxy:Plot>

这里布局文件定义了一个控件名myPlot、Y轴plotY，x轴plotX，数据线plotTemp”,其中TempData为要绑定的数据值；

初始化的时候，要定义数据值的列表集合

private List<DataPoint> TempData = new List<DataPoint>(); 

其中：DataPoint 为数据线结合的数据点坐标值(x,y);

Plot类的InvalidatePlot(bool )用来指定是否刷新数据。
效果图：

DynamicDataDisplay下载

点击下载库文件。

DynamicDataDisplay使用说明

同样的，在XMAL文件中首先添加引用http://research.microsoft.com/DynamicDataDisplay/1.0
之后构造图表，相对于OxyPlot较简单。

 <d3:ChartPlotter x:Name="ch" Margin="54,32,59.6,41" ></d3:ChartPlotter>

使用时，后台需要添加引用

Microsoft.Research.DynamicDataDisplay;
Microsoft.Research.DynamicDataDisplay.DataSources;

折线图数据源

ObservableDataSource<Point> 

方法：

AppendAsync(Dispatcher dis, Point  point) 将点写入数据源

参数方法

ch1.Viewport.Visible
对象： Rect(double x，doubley，double wdith， double height)  //(原点x，原点y，宽，高)

参考示例：

 ch.Viewport.Visible = new Rect(0, 0, 20, 40);
 ch.AddLineGraph(source, Colors.Blue, 1, "温度");

//虚拟数据源
tem = Convert.ToDouble(random.Next(10,15));

Point p = new Point();
p.X = x;
x++;
p.Y = tem;
source.AppendAsync(Dispatcher, p);
if (x > 10)
{
   ch.Viewport.Visible = new Rect(x - 10, 0, 20, 40);
}

效果图：

Demo下载

参考以上说明如果还有问题请留言，或者下载Demo。