相关疑难解决方法(0)

我正在显示饼图.但是如何在饼图中显示标签.

下面是饼图的chart.js代码.

this.Pie = function(data, options) {

  chart.Pie.defaults = {
    segmentShowStroke: true,
    segmentStrokeColor: "#fff",
    segmentStrokeWidth: 2,
    animation: true,
    animationSteps: 100,
    animationEasing: "easeOutBounce",
    animateRotate: true,
    animateScale: false,
    onAnimationComplete: null
  };

  var config = (options) ? mergeChartConfig(chart.Pie.defaults, options) : chart.Pie.defaults;

  return new Pie(data, config, context);
};

以下是用于显示饼图的html文件的代码

码:

var data = [{
  value: 20,
  color: "#637b85"
}, {
  value: 30,
  color: "#2c9c69"
}, {
  value: 40,
  color: "#dbba34"
}, {
  value: 10,
  color: "#c62f29"
}];

var canvas = document.getElementById("hours");
var ctx = …

使用Chart.js库时,我可以在页面上添加多个甜甜圈而不会出现问题.

http://www.chartjs.org/docs/#doughnut-pie-chart

但我无法找到一种始终显示工具提示的方法 - 不仅仅是将鼠标悬停在甜甜圈上时.有人知道这是否可行？

我想通过单击按钮同时在多个图表上重现悬停行为。我正在考虑将等效的按钮 ID 添加到图形标签中。

例如，通过单击橙色按钮（参见附图），我获得了他的 ID，并且我想触发每个图表的每个橙色项目中的事件悬停（其标签与按钮的 id 相同）。

我可以检测到哪个项目具有与我的 id 相同的标签，但我不知道如何在其上复制悬停行为。

有没有办法强制在图表中的项目上设置悬停模式？

我的 HTML：

<div class="graph">
  <canvas id="ctx"></canvas>
  <button type="button" class="btn btn-primary" id="OCG">Test</button>
</div>

我的JS：

var ctx = document.getElementById('ctx').getContext('2d');
var ocacolor = '#EE8B54',
    ocbcolor = '#C2B49B',
    ocbacolor = '#AECF86',
    ocgcolor = '#E97676',
    ocpcolor = '#088DA5';
var backgroundcolor = [ocacolor, ocbcolor, ocbacolor, ocgcolor, ocpcolor]

data = {
    datasets: [{
        data: [1, 1, 1, 4, 1],
        backgroundColor: backgroundcolor
    }],
    labels: [
        'OCA',
        'OCB',
        'OCBA',
        'OCG',
        'OCP'
    ]
};

//CREATING CHART
var myDoughnutChart = …