javascript - chart.js 在点击时增加值(value)

Question

我用图表 js 创建了一个雷达图。我可以添加标签，但现在我想知道如何不输入值而是将它们全部设置为 0 并在单击标签时增加/更新 +1

http://jsfiddle.net/pevy7vsz/15/

var ctx = $("#myChart").get(0).getContext("2d");

var myNewChart = new Chart(ctx);

var data = {
    labels: ["January", "February", "March", "April", "May", "June", "July"],
    datasets: [ {
                  label: "My First dataset",
                  fillColor: "rgba(220,220,220,0.2)",
                  strokeColor: "rgba(220,220,220,1)",
                  pointColor: "rgba(220,220,220,1)",
                  pointStrokeColor: "#fff",
                  pointHighlightFill: "#fff",
                  pointHighlightStroke: "rgba(220,220,220,1)",
                  data: [65, 59, 80, 81, 56, 55, 40]
              } ] 
};

var myRadarChart = new Chart(ctx).Radar(data);
$("#add").on( "click", function() {

    var month = $("#month").val();
    var value = $("#value").val();
    var values = new Array();

    values.push(value);

    console.log("adding data...");
    console.log("month:" + month);
    console.log("value:" + value);

    myRadarChart.addData(values, month);

    console.log("data added...");  
});

Answer 1

您可以使用函数“getPointsAtEvent”，它返回 ChartElement:

ChartElement {value: 4, label: "January", datasetLabel: "My First dataset", x: 197.1083317156525, y: 125.62930048634354…}

使用这个函数:

var canvas = document.getElementById("myChart") canvas.onclick = function(evt){
var activePoints = myRadarChart.getPointsAtEvent(evt);
activePoints[0].value++;
myRadarChart.update();
console.log(activePoints[0]); };

查看完整示例:http://jsfiddle.net/pevy7vsz/29/