DynamicDataDisplay-BarChart_.NET_编程开发_程序员俱乐部

中国优秀的程序员网站程序员频道CXYCLUB技术地图
热搜:
更多>>
 
您所在的位置: 程序员俱乐部 > 编程开发 > .NET > DynamicDataDisplay-BarChart

DynamicDataDisplay-BarChart

 2016/6/17 5:34:19  新孔凡童  程序员俱乐部  我要评论(0)
  • 摘要:对于d3的BarChart,其数据源为ItemsSource,支持bingding。<d3:BarChartItemsSource="{BindingSampleDatas}"><d3:TemplateMarkerGenerator><DataTemplate><RectangleStroke="BlanchedAlmond"StrokeThickness="0"StrokeLineJoin="Round"d3:ViewportPanel.X="
  • 标签:

对于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属性赋值,既可以画出柱状图。

  • 相关文章
发表评论
用户名: 匿名