Question

我们一直在使用tips series配置来为 ExtJS 4＆amp; 5 即可。但是使用 ExtJS 6 ，它不再起作用了。那么使用 ExtJS 6 图表包显示提示的正确方法是什么？

series: [{
    type: 'pie',
    field: 'count',
    showInLegend: true,
    donut: false,
    tips: {
        trackMouse: true,
        width: 140,
        height: 40,
        renderer: function(storeItem, item) {
            this.update(storeItem.get('name') + ':' + storeItem.get('count'));
        }
    }
}]

Answer 1

看起来工具提示renderer方法参数已在版本之间交换，否则您的fiddle几乎就在那里。 this关键字似乎是系列而不是工具提示 - 最好不依赖于ExtJS中的JS上下文，Sencha似乎在重构API时付出了努力，以确保您能够始终期望引用相关组件作为任何回调的第一个参数。

如果查看API中的series-tooltip，它将确认第一个参数是对工具提示的引用，第二个参数是所选记录 - 因此您可以按如下方式更新工具提示：

{
    xtype: 'pie'
    // ...
    tooltip: {
        // ...
        renderer: function(tip, item){
            tip.update(item.get('name') + ': ' + item.get('count'));
        }
    }
}

» updated fiddle

Answer 2

似乎您已从ext-charts切换到sencha-charts。

tips不再是Series属性：

ExtJS 4 - http://docs.sencha.com/extjs/4.0.7/#!/api/Ext.chart.series.Series-cfg-tips

ExtJS 6 - http://docs.sencha.com/extjs/6.0/6.0.0-classic/#!/api/Ext.chart.series.Series

尝试工具提示属性，它应该与之前的提示相同

Answer 3

tooltip: {
  trackMouse: true,
  renderer: function(toolT, storeItem) {
              toolT.setHtml('dummy tooltip');
  }
}

试试这个。

ExtJS 6 - 如何在图表上显示提示？

3 个答案: