Jquery中用echarts3作詞雲,已在項目中使用

開頭必定要引入這兩個js,奇怪的是,3.3.2的echarts.js我下載下來以後詞雲就出不來了,因此暫時只能這樣了,javascript

<script src="https://cdn.bootcss.com/echarts/3.3.2/echarts.js"></script>
<script src='/resources/dist/worldcloud.js'></script>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('chart_wordCloud'));
$(function(){
    echartsCloud();//初始化echarts圖
})
function echartsCloud(){
// 基於準備好的dom,初始化echarts實例
myChart.setOption({
    tooltip: {},
    series: [{
         name:'頻率',
        type : 'wordCloud',  //類型爲字符雲
            shape:'smooth',  //平滑
            gridSize : 2, //網格尺寸
            size : ['80%','80%'],
            sizeRange : [ 35, 100 ],  
            rotationRange : [ -50, 80 ], //旋轉範圍
             textStyle : {  
                normal : {
                    fontFamily:'sans-serif',
                    color : function() {  
                        return 'rgb('  
                                + [ Math.round(Math.random() * 160),  
                                        Math.round(Math.random() * 160),  
                                        Math.round(Math.random() * 160) ]  
                                        .join(',') + ')';  
                    }  
                },  
                emphasis : {  
                    shadowBlur : 5,  //陰影距離
                    shadowColor : '#333'  //陰影顏色
                }  
            },
            data:[],
    }]
});
  //異步加載數據
$.ajax({
    type:"POST",
    url:"/pcDocumentAction/wordCloud.action?view=json&time="+'30',
    success:function(data){
          myChart.setOption({
                series: [{
                    data: data.obj
                }]
            });
    }
}); 
};
function selectChange(){
    var time=$("#select option:selected").val();
    $.ajax({
        type:"POST",
        url:"/pcDocumentAction/wordCloud.action?view=json&time="+time,
        success:function(data){
              myChart.setOption({
                    series: [{
                        data: data.obj
                    }]
                });
        }
    }); 
};
</script>css

相關文章
相關標籤/搜索