echarts实现词云效果vue

cnpm install  echarts-wordcloud --save;
cnpm install echarts --save

在需要组件中直接 require(“echarts-wordcloud”);即可；

  var echarts = require("echarts");
  require("echarts-wordcloud");
  var data = {
      value: [{
              name: "独居老人",
              value: 25
          }....
      ],
      image: "" //自定义图片
  };
   var myChart = echarts.init(document.getElementById('main'));
   var maskImage = new Image();
      maskImage.src = data.image
  
      maskImage.onload = function(){
	  	myChart.setOption({
	       tooltip: {
	          show: false
	      },
	      series: [{
	          type: "wordCloud",
	          gridSize: 20,
	          sizeRange: [12, 30],
	          rotationRange: [0, 0, 25, 90],
	          maskImage: maskImage,
	          textStyle: {
	              normal: {
	                  color: function() {
	                      return (
	                          "rgba(" +
	                          Math.round(Math.random() * 255) +
	                          ", " +
	                          Math.round(Math.random() * 255) +
	                          ", " +
	                          Math.round(Math.random() * 255) +
	                          ",1)"
	                      );
	                  },
	                  emphasis: { 
	                      shadowBlur: 10,
	                      shadowColor: '#333'
	                  }
	              }
	          },
	          left: "center",
	          top: "center",
	          right: null,
	          bottom: null,
	          data: data.value
	      }]
	  }) 
	}