我想在我的自定义组件中使用此github链接在角度2的仪表板中组合条形图和折线图:
https://github.com/akveo/ng2-admin
(仪表板有一个内置条形图,我试图在我的自定义组件中调用它)
我创建了一个名为barChart.component.ts
的组件更新代码
无功/网络/ HTML / Angular2 \ NG2管理员主\ SRC \应用\页面\仪表板\ BARCHART \ barChart.component.ts
import {Component} from '@angular/core';
import { ChartistJsService } from '../../charts/components/chartistJs/chartistJs.service';
import * as Chart from 'chart.js';
@Component({
selector: 'bar-chart',
template: `
<ba-chartist-chart baChartistChartClass="ct-chart"
baChartistChartType="Bar"
[baChartistChartData]="data['simpleBarData']"
[baChartistChartOptions]="data['simpleBarOptions']">
</ba-chartist-chart>
<ba-chartist-chart baChartistChartClass="ct-chart"
baChartistChartType="Line"
[baChartistChartData]="data['simpleLineData']"
[baChartistChartOptions]="data['simpleLineOptions']">
</ba-chartist-chart>
`
})
// TODO: move chart.js to it's own component
export class BarChart {
public simpleBarData: {
data:any;
constructor(private _chartistJsService:ChartistJsService) {
}
ngOnInit() {
this.data = this._chartistJsService.getAll();
}
}
这里显示条形图和折线图(条形图下方的折线图单独与轴),但我只希望折线图在条形图上合并(没有折线图的x和y轴)。