我正在尝试使用角度4绘制直方图。我将拥有一组数据,每个数据包含1000个值。如果有两个数组,我应该能够显示组织图。要求是只需要绘制直方图而不是数据。
下面的链接绘制了直方图以及数据。我需要隐藏当前显示为散点的数据位。我该怎么做?
http://jsfiddle.net/x51b6pvs/15/
角直方图分量
import { Component, Input,OnInit } from '@angular/core';
@Component({
selector: 'histogramchart',
template: '<chart [options]="options" (load)="getInstance($event.context)"></chart>',
styles: [`
chart{
display: block;
width: 100% !important;
padding:0;
}
`]
})
export class HistogramChartComponent {
public options: any;
chart: any;
@Input() public series: any;
ngOnInit(){
}
constructor() {
this.options = {
credits: {
enabled: false
},
title: {
text: ''
},
chart: {
type: 'histogram'
},
legend: {
align: 'right',
verticalAlign: 'bottom',
layout: 'horizontal',
margin: 25,
itemMarginTop: 0,
symbolRadius: 0,
symbolHeight: 20,
symbolWidth: 20
},
xAxis: [{
title: { text: 'Ending Surplus' },
alignTicks: false
}, {
title: { text: 'Count of Ending Surplus' },
alignTicks: false,
}],
yAxis: [{
title: { text: '' }
}, {
title: { text: '' },
}],
series: [{
type: 'histogram',
xAxis: 1,
yAxis: 1,
zIndex: -1,
baseSeries: 's1',
showInLegend: false
}]
};
}
getInstance(chartInstance): void {
this.chart = chartInstance;
this.redraw();
}
ngOnChanges(data: any) {
if (!data.series.currentValue || !this.chart) return;
data.series.currentValue.map(s => {
this.chart.addSeries(s);
});
this.chart.reflow();
}
redraw() {
if (!this.chart) return;
this.series.map(s => {
if(s!=null)
this.chart.addSeries(s);
});
}
}