Question

我正在使用Chart.js并且有一个问题，我需要一些帮助。

圆环正确创建并显示我需要的信息，但是，当我将鼠标悬停在图表的某个方面时，它仅显示filltext值。

这是我正在使用的代码

options = {
    cutoutPercentage: 75,
    rotation: Math.PI,
    //circumference: Math.PI * values[0],
    //segmentShowStroke: false,
    animation: {
        animateScale: true,
        onComplete: function () {
            var width = this.chart.width,
                height = this.chart.height;

            var fontSize = (height / 114).toFixed(2);
            this.chart.ctx.font = fontSize + "em Verdana";
            this.chart.ctx.textBaseline = "middle";

            var text = "82%",
                textX = Math.round((width - this.chart.ctx.measureText(text).width) / 2),
                textY = height / 2;
            console.log(RpData);
            this.chart.ctx.fillText(RpData.datasets[0].data[0] + "%", textX, textY);
        }
    },

    legend: {
        display: false,
    },
    tooltips: {
        enabled: false,
    },

};

$('#riskFactorChartLoading').hide("fast");
var ctx = $("#riskFactorChart").get(0).getContext("2d");

var riskFactorChart = new Chart(ctx, {
    type: 'doughnut',
    data: RpData,
    options: options
});

看起来像这样;

我想要实现的是看到鼠标悬停的结果而不必将鼠标悬停在它上面以查看我的值。

由于

Answer 1

请提供您的完整代码。因为代码中没有给出“RpData”....

这是jsfiddle链接工作正常，但由于您没有给出完整代码段或代码的任何链接，我们无法检查问题是什么...

Chart JS snippet - (dkrvl2011)

Chart.js - 填充文本仅在悬停在甜甜圈的一部分上时出现

1 个答案: