CODEWITHSUNDEEP
javascriptangularjsd3.jsnvd3.jsangular-nvd3
user1142130
user1142130

Reputation: 1645

NVD3 Dispatch Events Don't Work On HistoricalBarChart

I am trying to get the chart click and mouse events to work on the NVD3 historical bar chart- but I'm failing to do so. Please see plnkr here http://plnkr.co/edit/Hnyi1A? I see here https://github.com/krispo/angular-nvd3/issues/36 that they recommend to use interactiveLayer property, however it does not seem to be working. Could be possibly be a bug?

    chart: {
      type: 'historicalBarChart',

      //None of these events work 
      interactiveLayer: {
        dispatch: {
          chartClick: function(e) {
            console.log("! chart Click !")
          },
          elementClick: function(e) {
            console.log("! element Click !")
          },
          elementDblClick: function(e) {
            console.log("! element Double Click !")
          },
          elementMouseout: function(e) {
            console.log("! element Mouseout !")
          },
          elementMouseover: function(e) {
            console.log("! element Mouseover !")
          }
        }
      }
...
}

Upvotes: 2

Views: 1273

Answers (1)

Lesley
Lesley

Reputation: 1395

NVD3's LiveEdit page in Extended mode gives all the documentation about what settings are available. Looks like you need bars instead of interactiveLayer to get the bar events on a historicalBarChart:

chart: {
  type: 'historicalBarChart',      
  bars: {
    dispatch: {          
      elementClick: function(e) {
        console.log("! element Click !")
      },
      elementDblClick: function(e) {
        console.log("! element Double Click !")
      },
      elementMouseout: function(e) {
        console.log("! element Mouseout !")
      },
      elementMouseover: function(e) {
        console.log("! element Mouseover !")
      }
    }
  }

I couldn't get chartClick to fire though. But as it's commented out in NVD3's own plnkr (of discreteBarChart type) I would be suspicious that something is wrong there.

Upvotes: 1

Related Questions