angular2 + wijmo5 - 注释线

时间:2017-09-21 07:37:45

标签: angular2-template angular2-directives devextreme wijmo5

如何在我的Angular 2应用程序中绘制概率分布图。

我尝试使用wijmo注释行。它使用起点和终点坐标工作 我需要使用x-y数据坐标点绘制线条。

还尝试使用wj-flex-chart-annotation-line(DataIndex和DataCoordinate)附件属性。我如何使用附件选项指定数据点。使用附件选项提供数据类型点所需的值是什么?

<wj-flex-chart [itemsSource]="data" [chartType]="'Spline'" [bindingX]="'country'">

    <wj-flex-chart-axis [wjProperty]="'axisX'" [title]="titleX" [labels]="false"></wj-flex-chart-axis>
    <wj-flex-chart-axis [wjProperty]="'axisY'" [title]="titleY"></wj-flex-chart-axis>

    <wj-flex-chart-series [binding]="'sales'"></wj-flex-chart-series>

    <wj-flex-chart-annotation-layer>
        <wj-flex-chart-annotation-line [position]="2" [start]="{x: 250, y: 0}" [end]="{x: 250, y: 300}" ></wj-flex-chart-annotation-line>        
        <wj-flex-chart-annotation-line [attachment]="'DataIndex'" [wjProperty]="'axisX'" [pointIndex]="2"></wj-flex-chart-annotation-line>
    </wj-flex-chart-annotation-layer>
</wj-flex-chart>

data = [
  {'country': "US", 'downloads': 3457, 'sales': 1681.374337182966}, 
  {'country': "Germany", 'downloads': 467, 'sales': 5821.869030096296}, 
  {'country': "UK", 'downloads': 12151, 'sales': 2260.865004748749}, 
  {'country': "Japan", 'downloads': 19762, 'sales': 2331.3376444697155}, 
  {'country': "Italy", 'downloads': 13341, 'sales': 6264.880417785565}, 
  {'country': "Greece", 'downloads': 1088, 'sales': 80.409117985476}
];

使用的参考链接是:

Angular 2 Chart Annotation

WjFlexChartAnnotationLine Class

谢谢。

0 个答案:

没有答案