vue前端生成词云图的方法

最新推荐文章于 2024-04-28 13:46:58 发布

立志当大佬

最新推荐文章于 2024-04-28 13:46:58 发布

阅读量903

点赞数

分类专栏：毕业设计 vue 文章标签：前端 vue.js echarts

本文链接：https://blog.csdn.net/weixin_45872600/article/details/128133194

版权

毕业设计同时被 2 个专栏收录

16 篇文章 0 订阅

订阅专栏

vue

4 篇文章 0 订阅

订阅专栏

我试过很多方法，自定义词云图、echarts-wordcloud、highcharts都是各种各样报错，基本是是找不到wordcloud模块，引入了也会报错，最终发现js2wordcloud可以用

import Js2WordCloud from 'js2wordcloud'

 word_option:{
            tooltip: {
            show: true
           },
            list: [['谈笑风生', 80], ['谈笑风生', 80], ['谈笑风生', 70], ['谈笑风生', 70], ['谈笑风生', 60], ['谈笑风生', 60]],
            // color: 'green',
          }

 getJS2WordList(){
      this.$http({
          url: this.$http.adornUrl('/feelings/wordcloud/weiboWordList'),
          method: 'get',
          params: this.$http.adornParams({
            'dateId': '2022-11-29'
          })
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.wordList = data.wordList
            console.log(this.wordList)

            var list=[]
            for(var i=0;i<this.wordList.length;i++){
                  list.push([this.wordList[i]['name'],this.wordList[i]['count']])
            }

            this.word_option['list']=list
        

            this.chartWord = new Js2WordCloud(document.getElementById('word'))
            
          
            this.chartWord.setOption(this.word_option)
          } else {
            this.wordList = []
          }
        })
     
     
   

      },