Events

dhtmlxChart allows handling different kinds of events in your application. It can be mouse click or click on item. The field of actions is rather wide.

You can attach several handlers to the same event, and all of them will be executed.

Adding event

If you need to attach event to an application, use attachEvent() method.

BarChart.attachEvent("onItemClick", function(id){
    BarChart.remove(id);
    return true;
})

In the code snippet showed above, event handler allows you to delete from the Bar Chart the bar you click on by using the remove() method.

Deleting Event

You can also delete event if you need. The detachEvent() method helps you here.

var myEvent = BarChart.attachEvent("onItemClick", function(id){
      BarChart.remove(id);
      return true;
});
BarChart.detachEvent(myEvent);

The following events are available in chart:

• Before Events:
  • onBeforeAdd - occurs before an item is adding to datastore;
  • onBeforeDelete - fired before an item is deleted;
  • onBeforeRender - called before a chart is re-painted;
  • onBeforeSort - invoked before a dataset is sorted;
• After Events:
  • onAfterAdd - occurs after an item is added to datastore;
  • onAfterDelete - called after an item is deleted;
  • onAfterSort - occurs after a dataset is sorted;
• Item Events:
  • onItemClick - occurs when an item is clicked
  • onItemDblClick - called when an item is double-clicked
• Mouse Events:
  • onMouseMove - occurs when mouse pointer is pointed over an item;
  • onMouseMoving - fired when mouse pointer is moved over a chart;
  • onMouseOut - called when the mouse pointer is moved out of item area;
• XML Events
  • onXLE - invoked when XML parsing is over, data are already available;
  • onXLS - occurs when XML parsing starts;

Related sample:  Events

Back to top