Results 1 to 3 of 3

Thread: itemclick for 3D Charts not working for version 6.2.1

  1. #1
    Sencha Premium User
    Join Date
    Feb 2017
    Posts
    2

    Default itemclick for 3D Charts not working for version 6.2.1

    Trying to get the itemclicked event to fire when you click on a column in a 3D Chart. I added the plugin for chartitemevents to code and I have the listener set for the series, but nothing happens when I tried to send message to console log. Any help would be greatly appreciated. Here is the sample code:

    Ext.create('Ext.chart.CartesianChart', {
    plugins: {
    ptype: 'chartitemevents',
    moveEvents: true
    },
    renderTo: 'body',
    width: 800,
    height: 500,
    layout: 'fit',
    items: [{
    xtype: 'chart',
    theme: 'muted',
    animate: true,
    shadow: true,
    style: 'background: #fff',
    bodyStyle: 'background: transparent !important',
    insetPadding: '10 10 10 5',
    flipXY: false,
    store: store2,
    interactions: ['itemhighlight'],
    animation: Ext.isIE8 ? false : {
    easing: 'backOut',
    duration: 500
    },
    axes: [{
    title: 'Variance',
    type: 'numeric3d',
    position: 'left',
    fields: ['variance'],
    minimum: -30,
    maximum: 30,
    grid: {
    odd: {
    fillStyle: 'rgba(255, 255, 255, 0.06)'
    },
    even: {
    fillStyle: 'rgba(0, 0, 0, 0.03)'
    }
    }
    }, {
    type: 'category3d',
    position: 'bottom',
    fields: 'name',
    label: {
    rotate: {
    degrees: -30
    }
    },
    grid: true
    }],
    series: [{
    type: 'bar3d',
    xField: 'name',
    yField: ['variance'],
    highlight: true,
    highlight: {
    strokeStyle: 'black',
    showStroke: true,
    lineWidth: 1
    },
    label: {
    'text-anchor': 'middle',
    field: 'variance',
    orientation: 'horizontal',
    fill: 'black',
    fontWeight: 'bold',
    display: 'insideEnd',
    renderer: Ext.util.Format.numberRenderer('0.00')
    },
    tips: {
    trackMouse: true,
    width: 110,
    height: 45,
    renderer: function (tooltip, record, item) {
    tooltip.setHtml(' Current : ' + record.get('current') + ' Variance: ' + record.get('variance'));
    }
    },
    renderer: (function () {
    var colors = ['#FFEC94', 'gold','green', 'aqua', '#4091ba', 'red', 'purple','orange'];
    return function (sprite, config, data, index) {
    return {
    fillStyle: colors[index],
    strokeStyle: index % 1 ? 'none' : 'black',
    opacity: index % 1 ? 1 : 0.5
    };
    }
    })(),
    listeners: {
    itemmousemove: function (series, item, event) {
    console.log('itemmousemove', item.category, item.field);
    },
    itemclick: function(series, item, event) {
    console.debug(item);
    console.debug(event);
    }
    }
    }]
    }]
    })
    }
    });

  2. #2
    Sencha Premium User
    Join Date
    Feb 2017
    Posts
    2

    Default

    ok, making progress. when I move the plugin so it is inside the items: tag the listener now responses to the console with the message on the item clicked event. Now need to figure out the exact syntax to get the value of the column name.

  3. #3
    Sencha User
    Join Date
    Feb 2013
    Location
    California
    Posts
    11,985
    Answers
    506

    Default

    The plugin should be configured within the chart config as you have it originally above. The 'itemclick' listener should be placed on the chart as well (on all series rather than one in particular) as noted in the doc example code:
    http://docs.sencha.com/extjs/6.2.1/c...temEvents.html

Similar Threads

  1. Replies: 4
    Last Post: 8 Sep 2016, 9:31 PM
  2. Dataview itemclick not working
    By sha.zylinc in forum Ext 5: Q&A
    Replies: 2
    Last Post: 13 Apr 2015, 3:08 AM
  3. Chart Series itemclick not working on firefox
    By marco.napetti in forum Ext:Bugs
    Replies: 5
    Last Post: 5 May 2014, 5:30 AM
  4. [OPEN] Charts not working in this version of IE8
    By cheland in forum Ext:Bugs
    Replies: 10
    Last Post: 25 Jul 2011, 5:31 AM
  5. [API] [3.3.1] itemclick event is missing for Charts
    By mitchellsimoens in forum Ext 3.x: Bugs
    Replies: 0
    Last Post: 18 Mar 2011, 6:33 AM

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •