How to ad an onclick function on angular-flot bars

Question

im using angular-flot to create a char representation of some data, this is my .html :

<div  flot  id="dataChar" [dataset]="barData" [options]="barOptions" height="300"></div>

Then in my .ts I configure the flot by adding the options:

    barData: any;
      barOptions = {
        series: {
          bars: {
            align: 'center',
            lineWidth: 0,
            show: true,
            barWidth: 0.6,
            fill: 0.9
          }
        },
        grid: {
          borderColor: '#eee',
          borderWidth: 1,
          hoverable: true,
          backgroundColor: '#fcfcfc',
          clickable:true
        },
        tooltip: true,
        tooltipOpts: {
          content: function (label, x, y) { return x + ' : ' + y; }
        },
        xaxis: {
          tickColor: '#fcfcfc',
          mode: 'categories'
        },
        yaxis: {
          tickColor: '#eee'
        },
        shadowSize: 0
      };

I've seen that in ChartJs you can use onClick, and I tried to use it here but its not working, so how can I add the event here? All I've been searching appears to be in jquery and I dont know if I can use it in my project, so any help will be apreciated

Answer 1

Can you please check the "actions" array. I think you need to define the actions for your element. 'handler(chart)' is a method to add handlers. Check this post.

ChartJs floating bars

Answer 2

In Angular, use

(click)="onFlotClicked()"

For click events.