EXTJS 5图表工具提示在require []上使用“ sencha-charts”不起作用

Question

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

Answer 1

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

Answer 2

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

I used tooltip inplace of tips and this.setHtml() in place of this.setTitle() ,and it worked for me.