DynamicDataDisplay-BarChart

對於d3的BarChart，其數據源為ItemsSource，支持bingding。

<d3:BarChart ItemsSource="{Binding SampleDatas}">
　　<d3:TemplateMarkerGenerator>
　　　　<DataTemplate>
　　　　　　<Rectangle Stroke="BlanchedAlmond" StrokeThickness="0" StrokeLineJoin="Round"
　　　　　　　　　　　　d3:ViewportPanel.X="{Binding X}"
　　　　　　　　　　　　d3:ViewportPanel.Y="0"
　　　　　　　　　　　　d3:ViewportPanel.ViewportVerticalAlignment="Bottom"
　　　　　　　　　　　　d3:ViewportPanel.ViewportHeight="{Binding Ymax}"
　　　　　　　　　　　　Width="10"
　　　　　　　　　　　　Fill="Blue"
　　　　　　　　　　　　ToolTip="{Binding Ymax}" ToolTipService.InitialShowDelay="0"/>
　　　　</DataTemplate>
　　</d3:TemplateMarkerGenerator>
</d3:BarChart>

是利用綁定傳給了ItemsSource數據，柱狀圖中的Marker是利用ViewportPanel的屬性確定的位置，大小，其中X確定X值，Y確定marker在Y軸上的最小值，ViewportHeight確定marker的高度，ViewportWidth確定寬度。

其中SampleDatas為

private ObservableCollection<SampleDataForBar> _sampleDatas;

public ObservableCollection<SampleDataForBar> SampleDatas
{
　　　　get { return _sampleDatas; }
　　　　set
　　　　　　{
　　　　　　　　_sampleDatas = value;
　　　　　　　　OnPropertyChanged("SampleDatas");//屬性更改通知
　　　　　　}
}

public class SampleDataForBar:BindableBase
{
　　private double x;
　　public double X
　　{
　　　　get { return x; }
　　　　set
　　　　　　{
　　　　　　　　x = value;
　　　　　　　　OnPropertyChanged("X");
　　　　　　}
　　}

　　private double ymax;

　　public double Ymax
　　{
　　　　get { return ymax; }
　　　　set
　　　　　　{
　　　　　　　　ymax = value;
　　　　　　　　OnPropertyChanged("Ymax");
　　　　　　}
　　}

}

SampleDataForBar類就是為了支持BarChart中的ItemsSource屬性，其中規定了X，和Ymax。

這樣只需要給SmpleDatas屬性賦值，既可以畫出柱狀圖。