Echarts(二):图实例1词云图

 

---

词云图

将文本数据可视化，用词汇组成的类似云的可视化图。

框架总结：

option = {
    title:{},
    tooltip: {},
    series: [{
        type: "wordCloud",//词云图
       词间距，内容，位置，大小,显示等配置
        data: [{name: "",value: },{name: "",value: }]
       词的内容和权重
    }]
};

trial：

option={
    title: [ 
        //内容格式:{text:'',x:'',y:'', textStyle: {fontSize: XXX}}
        {text: '这个阶段你睡得着觉?',x: 'center',y: 'top',
        textStyle: {color:'red',fontSize: 30},fontWeight:'bolder'},
        {text: '青年の关键词',x: 'center',y: '20%',
         textStyle: {color:'#ca44ab',fontSize: 20}}], //1.word cloud
    backgroundColor:'rgba(20,20,100,1)', // 背景色
    tooltip:{show:true},
    series:[{type: 'wordCloud', 
        gridSze:5,//间距
        ship:'pentagon',//形状五角星
        sizeRange:[5,20],
        width:400,
        height:500,
        label: {normal: {//1.word cloud
                show: true,
                position: 'right'}},
        textStyle: {//随机显示颜色
              normal: {
                color: function() {
                  return (
                    "rgb(" +
                    [
                      Math.round(Math.random() * 160),
                      Math.round(Math.random() * 160),
                      Math.round(Math.random() * 160)
                    ].join(",") +")");
                }
              }},
        data: [
            {name:'NI3E',value:5},{name:'好好学习',value:10},
            {name:'DDL是第一生产力',value:8},{name:'二十一世纪好青年',value:14},
            {name:'只要学不死',value:8},{name:'七月前学会',value:15},
            {name:'就往死里学',value:10},{name:'NI3E',value:10},
            {name:'Echarts',value:20},{name:'做一个勤奋的小孩',value:50}]}]};

好消息！正常运行了；坏消息：没有词云。

error：没有办法显示图

以前都是直接option在官网在线运行，但是现在运行不了。

echarts官网示例找不到worldcloud示例，网上找到的基本也不能使用。

（猜测）可能是因为官网不支持了，所以需要写成html在浏览器运行。

·ECharts 的词云图是一个插件类型的图表。在 ECharts 官网下载的完整版本不包含词云图，使用时，需要在引入 echarts.js 之后，另外引入词云图对应的 echarts-wordcloud.js`。

·版本问题：echarts-wordcloud 2 对应的是echarts5, echarts-wordcloud 1对应的是echarts 4。

·echarts-wordcloud下载https://github.com/ecomfe/echarts-wordcloud 

感觉这个好奇怪，为什么跳转到付费下载的版面了？复制网站在浏览器直接打开去github下载

---

参考：

·王大伟老师《Echarts数据可视化》

·https://blog.csdn.net/qq_41181590/article/details/108535203

·https://blog.csdn.net/qq_29132907/article/details/96482497

·https://segmentfault.com/a/1190000023022232