這多是目前最輕量級、最支持MVVM、可定製性最好的開源WPF Chart控件！

因爲項目中常常用到Series Chart，而目前市面又實在找不到既支持MVVM，又輕量級的開源Chart控件，因而乾脆就花了兩週時間隨手寫了一個。昨天感受還比較滿意，就發佈到了Github上：https://github.com/zenjia/MvvmChart

特點：

• 支持MVVM設計模式： 這也是其最大的特點，用戶能夠自定義SeriesDataTemplate，並支持SeriesDataTemplateSelector（具體信息見Github項目簡介）。事實上，當初開發這套控件的初衷就是由於找不到開源的支持MVVM的WPF Chart控件；
• 功能豐富：支持多種經常使用的Line Series（包括Polyline，StepLine，Spline）和Area Series（包括PolylineArea，StepLineArea，SplineArea），支持顯示Item Point。座標軸支持多重放置模式。支持GridLine，CrossHairs等；
• 高度可定製：Series和Item Point的自定義均可以經過簡單的Binding或修改Style來完成。座標軸的Label文本支持ValueConverter，tick支持用戶顯示指定的數據。
• 高度可擴展：主要的Series類都繼承自基類PathSeries。用戶能夠經過實現IGeometryBuilder並將其傳遞給PathSeries的GeometryBuilder屬性來建立本身的Series。理論上，用戶能夠自定義本身想要的任何類型，只要它能夠經過Path來繪製，所以這種模式具備高度的可擴展性；
• 輕量級：代碼簡潔，所有代碼不到5k行。功能專一於經常使用的Cartesian 2D Series Chart，不包含餅狀圖、柱狀圖等能夠簡單經過ItemsControl來繪製的Chart

截圖：

Line Series，無Item Point：（從上自下依次爲PolylineSeries、StepLineSeries、SplineSeries）

 

Line Series，帶Item Point：

 

Area Series，不帶Item Point：

Area Series，帶Item Point：

使用方法：

首先定義數據點：

    public class SomePoint
    {
        public double t { get; }
        public double Y { get; }
    }
    
    public class DemoDataViewModel 
    {
        public List<List<SomePoint>> ItemsSourceList { get; }
    }　　

 

 

而後建立DataTemplate：

        <DataTemplate x:Key="SeriesTemplate1">
            <mvvmCharting:PolyLineSeries IndependentValueProperty="t"
                                         DependentValueProperty="Y"
                                         Stroke="Red"
                                         StrokeThickness="1.5"
                                         ItemsSource="{Binding}">
            </mvvmCharting:PolyLineSeries>
        </DataTemplate>

 

最後，建立一個SeriesChart，並引用上面的DateTemplate：

   <mvvmCharting:SeriesChart Background="Bisque"
                             SeriesDataTemplate="{StaticResource SeriesTemplate1}"
                             SeriesItemsSource="{Binding ItemsSourceList, Source={StaticResource GlobalDemoDataViewModel}}">

       <mvvmCharting:SeriesChart.XAxis>
           <axis:XAxis />
       </mvvmCharting:SeriesChart.XAxis>

       <mvvmCharting:SeriesChart.YAxis>
           <axis:YAxis />
       </mvvmCharting:SeriesChart.YAxis>

   </mvvmCharting:SeriesChart>

 

（更多使用Sample見項目裏的Demo工程）

（對UWP的支持將很快加入）

（歡迎批評指正，歡迎提交bug）