我正在尝试使用PieceLabel插件在图形中显示标签,但无法正常工作。图形显示正常,这是我的代码:
TS
import * as Chart from 'chart.js'
import * as ChartPiece from 'chart.piecelabel.js'
ngAfterViewInit() {
this.canvas2 = document.getElementById('myChartPie');
this.ctx2 = this.canvas2.getContext('2d');
let myChartPie = new Chart(this.ctx2, {
type: 'pie',
data: {
labels: ["one", "two", "three", "four"],
datasets: [{
label: '# of Score',
data: [11,21,31,41],
backgroundColor: [
'red',
'blue',
'orange',
'green'
]
}]
},
options: {
responsive: false,
display:true,
pieceLabel: {
mode: 'value'
}
}
});
}
我使用npm install --save安装了Chart.js和Chart.piecelabel.js。我试图将其添加到.angular-cli.json文件中,但似乎没有任何效果:
"scripts": [
"../node_modules/chart.piecelabel.js/build/Chart.PieceLabel.min.js"
]
的HTML
<canvas id="myChartPie" width="650px"></canvas>
看来我的PieceLabel.min.js没有被调用/识别,我不确定为什么
这是因为,Chart.PieceLabel.js
plugin没有任何导出的成员(既不是named也不是default)。它只是将自己注册到Chart.js插件服务中。
因此,您的import
陈述应为:
import 'chart.piecelabel.js';
代替 :
import * as ChartPiece from 'chart.piecelabel.js'
旁注: 您无需在此插件脚本中angular-cli.json
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句