我想用两个值创建一个甜甜圈图。单击图形应在中心打印该值。我在stackoverflow中找到了与我的要求类似的解决方案。我想使用来自github的最新Chart.js库。最新的Chart.js中提供此功能吗?
在Chart.js v2.x中当然可以做这样的事情
我认为最好的方法是使用插件。实际上,Cmyker遮篷针对您链接到的问题甚至更新了他的帖子,以显示在Charts.js v2.x中如何工作
看他的小提琴:https : //jsfiddle.net/cmyker/ooxdL2vj/
以及相应的插件定义:
Chart.pluginService.register({
beforeDraw: function(chart) {
var width = chart.chart.width,
height = chart.chart.height,
ctx = chart.chart.ctx;
ctx.restore();
var fontSize = (height / 114).toFixed(2);
ctx.font = fontSize + "em sans-serif";
ctx.textBaseline = "middle";
var text = "75%",
textX = Math.round((width - ctx.measureText(text).width) / 2),
textY = height / 2;
ctx.fillText(text, textX, textY);
ctx.save();
}
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句