为每个chart.js数据值添加模态弹出窗口

时间:2016-11-08 13:24:19

标签: jquery modal-dialog chart.js

有没有办法为每个图表js数据值添加模态弹出窗口。这里dD 1,dD2等...是数据值,点击这个每个值,我需要打开模态弹出窗口。

var dData = function() {
  return Math.round(Math.random() * 90) + 10
};
var barChartData = {
  labels: ["dD 1", "dD 2", "dD 3", "dD 4", "dD 5", "dD 6", "dD 7", "dD 8", "dD 9", "dD 10"],
  datasets: [{
    fillColor: "rgba(0,60,100,1)",
    strokeColor: "black",
    data: [dData(), dData(), dData(), dData(), dData(), dData(), dData(), dData(), dData(), dData()]
  }]
}

var index = 11;
var ctx = document.getElementById("canvas").getContext("2d");
var barChartDemo = new Chart(ctx).Bar(barChartData, {
  responsive: true,
  barValueSpacing: 2
});
setInterval(function() {
  barChartDemo.removeData();
  barChartDemo.addData([dData()], "dD " + index);
  index++;
}, 3000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.0.2/Chart.min.js"></script>
  <canvas id="canvas"></canvas>

1 个答案:

答案 0 :(得分:1)

您可以在此处添加模型弹出代码,

$("#canvas").click( 
    function(evt){
        var activePoints = myNewChart.getSegmentsAtEvent(evt);           
        /* do something */
    }
);