热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

在Chart.js中向圆环图表添加标签会显示每个图表中的所有值

如何解决《在Chart.js中向圆环图表添加标签会显示每个图表中的所有值》经验,是哪儿的问题?

我正在使用Chart.js在我的网站上绘制一系列图表,并且我编写了一个帮助方法来轻松绘制不同的图表:

drawChart(ctxElement, ctxType, ctxDataLabels, ctxDataSets, midLabel) {
    var ctx = ctxElement;
    var data = {
        labels: ctxDataLabels,
        datasets: ctxDataSets
    };

    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 = midLabel,
                textX = Math.round((width - ctx.measureText(text).width) / 2),
                textY = height / 2;

            ctx.fillText(text, textX, textY);
            ctx.save();
        }
    });

    var chart = new Chart(ctx, {
        type: ctxType,
        data: data,
        options: {
            legend: {
                display: false
            },
            responsive: true
        }
    });
}

drawChart()方法的最后一个参数包含应该添加到图表中间的标签.该Chart.pluginService.register部分是绘制标签的代码.问题是,当我多次执行drawChart方法(在我的情况下为三次)并在方法执行中提供每个图表的标签时,所有三个标签在每个图表上都显示在彼此的顶部.我需要在相应的图表中显示每个标签.除标签外,所有其他参数均已正确处理.

我如何实现这一目标?


推荐阅读
author-avatar
西北人6668_733
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有