echarts 实现词云效果(worldcloud)
·
工作中需要展示一些节目名的频次分布,思考后决定使用词云这种形式。而现在echarts官网示例中已经找不到worldcloud的示例了,网上找到的基本也不能使用,最后还是从git上找到可以使用的,记录一下。
词云效果
会将所有传出的词按照频次越高字体越大这种形式展现,一目了然。
代码展示
引入指定worldcloud和echarts文件
<script src='./echarts.simple.js'></script>
<script src='./echarts-wordcloud.js'></script>
worldcloud实现
var chart = echarts.init(document.getElementById('main'));
var option = {
tooltip: {},
series: [ {
type: 'wordCloud',
gridSize: 2,
sizeRange: [12, 50],
rotationRange: [-90, 90],
shape: 'pentagon',
width: 600,
height: 400,
drawOutOfBound: true,
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: data
} ]
};
chart.setOption(option);
window.onresize = chart.resize;
示例demo下载地址
git地址
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐


所有评论(0)