如何删除 Vue Chart 数据点上的文本?
How to remove text over Vue Chart data points?
我正在尝试使用 vue-chartjs 制作一个简单的折线图,但我似乎无法摆脱每个数据点上方的文本。我似乎无法在任何地方找到如何摆脱这个或任何其他有这个问题的人。为了下面的演示,我简化了情况:
我通过props传入的图表数据定义为
let chartData = {
labels: ['a', 'b', 'c'],
datasets: [
{
data: [{ x: 'a', y: 1 }, { x: 'b', y: 2 }, { x: 'c', y: 3 }]
}
]
};
lineChart.js 文件接受的属性为:
export default {
extends: Line,
props: {
chartData: {
type: Object,
default: null
}
},
mixins: [mixins.reactiveProp],
mounted() {
this.renderChart(this.chartData);
},
};
使用默认选项,我得到一个如下所示的图表:Chart Image
你的图表版本是多少?
勾选thisfiddle code
查看我使用的 chartjs 包,我没有那个标签。
我发现我的 package.json 文件中导入了 chartjs-plugin-datalabels。默认情况下是标记数据点。要禁用此功能,我在选项中包含以下内容:
defaultOptions: {
plugins: {
"name given to plugin": false
}
}
我正在尝试使用 vue-chartjs 制作一个简单的折线图,但我似乎无法摆脱每个数据点上方的文本。我似乎无法在任何地方找到如何摆脱这个或任何其他有这个问题的人。为了下面的演示,我简化了情况:
我通过props传入的图表数据定义为
let chartData = {
labels: ['a', 'b', 'c'],
datasets: [
{
data: [{ x: 'a', y: 1 }, { x: 'b', y: 2 }, { x: 'c', y: 3 }]
}
]
};
lineChart.js 文件接受的属性为:
export default {
extends: Line,
props: {
chartData: {
type: Object,
default: null
}
},
mixins: [mixins.reactiveProp],
mounted() {
this.renderChart(this.chartData);
},
};
使用默认选项,我得到一个如下所示的图表:Chart Image
你的图表版本是多少?
勾选thisfiddle code
查看我使用的 chartjs 包,我没有那个标签。
我发现我的 package.json 文件中导入了 chartjs-plugin-datalabels。默认情况下是标记数据点。要禁用此功能,我在选项中包含以下内容:
defaultOptions: {
plugins: {
"name given to plugin": false
}
}