vue中添加字符云

 1.npm install echarts

   npm install echarts-wordcloud

  进行安装依赖

2.首先你得在你得main.js中进行如下的配置

import Echarts from 'echarts'

import 'echarts-wordcloud/dist/echarts-wordcloud'
import 'echarts-wordcloud/dist/echarts-wordcloud.min'

Vue.config.productionTip = false
Vue.prototype.echarts = Echarts
Vue.use(Echarts)
3.然后在你需要引入的组件进行如下配置

<template>
  <div class="indexTSectionTwo">
    <div class="indexTSectionTwoLeft">
      <img :src="mapSection.img" alt="" class="imgdom2">
    </div>
    <div class="indexTSectionTwoCenter" id="myChart">

    </div>
    <div class="indexTSectionTwoRight" id="myChartTwo">

    </div>
  </div>
</template>

<script>
  var echarts = require('echarts');
   require('echarts-wordcloud');

//进行如上面所示的俩个引用，还有你要在那个div里面引用，记得设置id名与宽mounted(){

   this.two()
},
methods:{
    //这下面的代码是echarts中的代码，，你只需要改 的是

myChartTwo，这个是你放字浮云的div的id名改这个就行，，剩下的全是echarts中的代码

    two(){
      var myData = echarts.init(document.getElementById('myChartTwo'));
      //测试开始three
        var markUrl = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAe8AAAB/CAYAAADGmEo6AAAACXBIWXMAAAsTAAALEwEAmpwYAAA/“
      var presents = ['计量', 'NQL', '标准', '认证认可', '质量效益', '手机壳', '八音盒', '剃须刀', '打火机', '手表', '巴克球', '模型', '音响', '蒙奇奇', '保温杯']

      var data = [];
      for (var i = 0; i < presents.length; ++i) {
        data.push({
          name: presents[i],
          value: (presents.length - i) * 20,
          textStyle: {
            normal: {},
            emphasis: {}
          }
        });
      }
      
    
    }


}

</script>