Wednesday, 15 March 2017

Extjs sencha column chart item click not working

In sencha column chart( Bar chart) itemclick not working this is not an issue. for this we need to add the chartitemevents plugin to the cartesian, the all the events will work.

This is the plugin
  plugins: {
        ptype: 'chartitemevents',
        moveEvents: true
    },


Bar 3D chart example as below.


Ext.create({
   xtype: 'cartesian',
   renderTo: Ext.getBody(),
   plugins: {
        ptype: 'chartitemevents',
        moveEvents: true
    },
   width: 600,
   height: 400,
   innerPadding: '0 10 0 10',
   store: {
       fields: ['name', 'apples', 'oranges'],
       data: [{
           name: 'Eric',
           apples: 10,
           oranges: 3
       }, {
           name: 'Mary',
           apples: 7,
           oranges: 2
       }, {
           name: 'John',
           apples: 5,
           oranges: 2
       }, {
           name: 'Bob',
           apples: 2,
           oranges: 3
       }, {
           name: 'Joe',
           apples: 19,
           oranges: 1
       }, {
           name: 'Macy',
           apples: 13,
           oranges: 4
       }]
   },
   axes: [{
       type: 'numeric3d',
       position: 'left',
       fields: ['apples', 'oranges'],
       title: {
           text: 'Inventory',
           fontSize: 15
       },
       grid: {
           odd: {
               fillStyle: 'rgba(255, 255, 255, 0.06)'
           },
           even: {
               fillStyle: 'rgba(0, 0, 0, 0.03)'
           }
       }
   }, {
       type: 'category3d',
       position: 'bottom',
       title: {
           text: 'People',
           fontSize: 15
       },
       fields: 'name'
   }],
   listeners:{
     itemclick: function(){
         alert('itemclick');
     }
   },
   series: {
       type: 'bar3d',
       xField: 'name',
       yField: ['apples', 'oranges']
   }
});







Source from sencha



No comments:

Post a Comment