100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > 在vue项目中使用js2wordcloud实现自定义词云形状的效果

在vue项目中使用js2wordcloud实现自定义词云形状的效果

时间:2022-04-24 14:35:01

相关推荐

在vue项目中使用js2wordcloud实现自定义词云形状的效果

npm install js2wordcloud

import Js2WordCloud from ‘js2wordcloud’

imageShape 是生成词云的样子的图片。不支持base64为的图片。只能是个地址(注意图片的路径。)、

list 就是tempData转换生成云词的数据~

words是源数据 根据数据的value确定生成词的大小。

下面只是部分参数。想要了解更多参数or参数意义自行百度or google js2wordcloud

how to userenderCloud(words) {let tempData = words;let list = [];tempData.forEach(item => {let arr = [];arr.push(item.name);arr.push(Math.sqrt(item.value));list.push(arr);});let option = {imageShape: require('@/assets/images/xxx.png'), // imageShape: '../static/wordcloud/xxx.png', tooltip: {show: false,formatter: function (item) {console.log(item)}},list: list,shape: 'pentagon',ellipticity: 1}// console.log(list);let wc = new Js2WordCloud(document.getElementById('chart'))wc.setOption(option)window.onresize = function () {wc.setOption(option);}},

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。