echarts之字符雲tooltip顯示混亂問題的解決辦法

echarts字符雲中tooltip顯示混亂主要表現為一下兩點:

1、字體與其顯示框內容不對應鼠標識別錯誤

　　解決思路:

　　就是option里的數據要對value降序排序（這一點很關鍵，是必須的一步）

　　把間距調大點 textPadding: 10。

2、文字丟失

　　解決思路:

　　size屬性是文字丟失的原因，最好設置為100%。

function wordWorldDraw(){ require([ 'echarts', 'echarts/chart/wordCloud' ], require.config({ paths: { echarts: '<%=request.getContextPath()%>/js/echarts/v2.2.7' } }); function(ec) { var myCharts=ec.init(document.getElementById('cloud')); var ecConfig = require('echarts/config'); var option = { title: { //因為字符雲的主標題是繪制在畫布上的 //text: 'Google Trends', //link: 'http://www.google.com/trends/hottrends' }, tooltip : { trigger : 'item', formatter : function(params) { return params.name+":"+params.value; } }, textStyle:{ }, series: [{  //name: '地域', type: 'wordCloud', size: ['100%', '100%'],//防止字體丟失 center:['60%','50%'], textRotation : [0, 45, 90, -45], textPadding: 3, autoSize: { enable: true, minSize: 14 }, data: CloudEchartsDataVOJson.seriesDatas//數據交互 } ] }; myCharts2.setOption(option);// 繪制表格 }); }