javascript - Can I bind an onclick event and edit a point in chartjs - Stack Overflow

admin管理员组

文章数量:1316974

I am using chartjs for making a small project. I am getting some confusion and hard luck in editing the points.

Is there any function in this library I can bind an onclick event to which will show me a pop up and I can remove the point?

Here is the summary what I want:

1. Click on the point and a popup appear
2. After clicking on the remove button it removed the point and redraw the point. Right now i am only using simple line chart this is my jsFiddle

I am using chartjs 2.6

I am using chartjs for making a small project. I am getting some confusion and hard luck in editing the points.

Is there any function in this library I can bind an onclick event to which will show me a pop up and I can remove the point?

Here is the summary what I want:

1. Click on the point and a popup appear
2. After clicking on the remove button it removed the point and redraw the point. Right now i am only using simple line chart this is my jsFiddle

I am using chartjs 2.6

• javascript
• chart.js
• chart.js2
• chartjs-2.6.0

Share Improve this question Follow edited Jan 1, 2018 at 11:41 fat_potato asked Nov 16, 2017 at 12:50 fat_potatofat_potato 65311 gold badge1111 silver badges3333 bronze badges 6

• No. that I know of! But you can open up a popup by triggering an event. Show some code for a better opinion. – funcoding Commented Nov 16, 2017 at 13:35
• i have only a jsfiddle of sample line chart nothing more. – fat_potato Commented Nov 16, 2017 at 13:41
• ok. show the link! – funcoding Commented Nov 16, 2017 at 13:41
• @funcoding jsfiddle/5rz5r9ag – fat_potato Commented Nov 16, 2017 at 13:46
• Yes you can. No pop-up in library but you can make your own. BTW, your question is probably gonna get closed. Better show us (include in question) what you've tried (code wise) so far to solve it. – ɢʀᴜɴᴛ Commented Nov 16, 2017 at 13:49

 |  Show 1 more ment

1 Answer 1

Sorted by: Reset to default 7

You can use the onclick event in the option to show the popup. Then you can check whether a point was clicked with getElementsAtEvent and if so remove it from the options and update the chart. I've updated your jsfiddle.

var option = {
    showLines: true,
    onClick: function(evt) {   
      var element = myLineChart.getElementAtEvent(evt);
      if(element.length > 0)
      {
        var ind = element[0]._index;
        if(confirm('Do you want to remove this point?')){
          data.datasets[0].data.splice(ind, 1);
          data.labels.splice(ind, 1);
          myLineChart.update(data);
        }
      }
    }
};

本文标签： javascriptCan I bind an onclick event and edit a point in chartjsStack Overflow