mvvmsencha-chartsextjs5appjs

EXTJS 5 Chart ToolTip Using "sencha-charts" on require[] not working


Im currently using ExtJs5 MVVM architecture and I require "sencha-chart" than "ext-chart" on the app.json file, Charts works fine but adding tooltip on the bar series im using doesn't work. No error logs.

I also check their example on sencha chart kitchensink (which chart tooltip is working) found out that they require "ext-chart" for that. My code for bar series with tooltip config:

series: [{
     type: 'bar',
     xField: 'name',
     yField: ['data1'],
         style: {
                opacity: 0.80
        },
        highlight: {
                fill: '#000',
                'stroke-width': 20,
                stroke: '#fff'
        },
        tips: {
                trackMouse: true,
                style: 'background: #FFF',
                height: 20,
                renderer: function(storeItem, item) {
                    this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + '%');
                }


                }

    }]

Is there something wrong with my codes?

Thanks


Solution

  • Your code needs one small change "tips" for EXTjs 5 becomes "tooltip."

    tooltip: {
        trackMouse: true,
        style: 'background: #FFF',
        height: 20,
        renderer: function(storeItem, item) {
             this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data1') + '%');
        }
    }
    

    However, there are a lot of bugs with the EXTjs 5 charts. I had this same issue, and submitted a bug to Sencha:

    http://www.sencha.com/forum/showthread.php?289313-Sencha-EXTjs-5-Charts-Broken-Tooltips