echarts如何实现热词图

热词图,看着要实现很难的样子,但实际并没有多么复杂,只需要将词云的js文件引入即可;其他的和饼图、柱形图相差无几,就多了两个词云的引入文件。

以下是词云的引入文件名称,没有的小伙伴可以自行网络下载一下即可

在这里插入图片描述

热词图实现代码,小伙伴们可以参考一下,有不同意见可以互相借鉴一下
var z1_option = {
title : {
text: ‘热词图’
},
series: [{
type: ‘wordCloud’,
gridSize: 20,
sizeRange: [12, 50],
rotationRange: [-90, 90],
shape: ‘pentagon’,
textStyle: {
normal: {
color: function() {
return ‘rgb(’ + [
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160)
].join(’,’) + ‘)’;
}
},
emphasis: {
shadowBlur: 10,
shadowColor: ‘#333’
}
},
data: [{
name: ‘Sam S Club’,
value: 10000,
}, {
name: ‘Macys’,
value: 6181
}, {
name: ‘Amy Schumer’,
value: 4386
}, {
name: ‘Jurassic World’,
value: 4055
}, {
name: ‘Charter Communications’,
value: 2467
}, {
name: ‘Chick Fil A’,
value: 2244
}, {
name: ‘Planet Fitness’,
value: 1898
}, {
name: ‘Pitch Perfect’,
value: 1484
}, {
name: ‘Express’,
value: 1112
}, {
name: ‘Home’,
value: 965
}, {
name: ‘Johnny Depp’,
value: 847
}, {
name: ‘Lena Dunham’,
value: 582
}, {
name: ‘Lewis Hamilton’,
value: 555
}, {
name: ‘KXAN’,
value: 550
}, {
name: ‘Mary Ellen Mark’,
value: 462
}, {
name: ‘Farrah Abraham’,
value: 366
}, {
name: ‘Rita Ora’,
value: 360
}, {
name: ‘Serena Williams’,
value: 282
}, {
name: ‘NCAA baseball tournament’,
value: 273
}, {
name: ‘Point Break’,
value: 265
}]
}]
};
//初始化
document.getElementById(‘hot_word_chart’).removeAttribute(“echarts_instance”);
var myChart1 = echarts.init(document.getElementById(‘hot_word_chart’), “macarons”);
myChart1.setOption(z1_option);

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值