echarts绘制词云图

最新推荐文章于 2024-02-28 15:00:52 发布

温wen而雅

最新推荐文章于 2024-02-28 15:00:52 发布

阅读量5.1k

点赞数 1

分类专栏：可视化

本文链接：https://blog.csdn.net/weixin_44541362/article/details/103984983

版权

可视化专栏收录该内容

2 篇文章 0 订阅

订阅专栏

<!DOCUMENT html>
<html>
<head>
<meta charset="utf-8">
<title>词云</title>
<script src="echarts.js"></script>
<script src="echarts-wordcloud.js"></script>
</head>
<body>
	<center>
		<div id="main" style="width:1000px;height:700px;"></div>
	</center>
	<script type="text/javascript">
			var Mychart = echarts.init(document.getElementById("main"));
			var data1 = [
			{name:'Java',value:200},
			{name:'Python',value:200},
			{name:'HTML',value:150},
			{name:'JavaSript',value:150},
			{name:'Java Web',value:180},
			{name:'MySQL',value:160},
			{name:'CentOS',value:170},
			{name:'Android',value:100},
			{name:'Hadoop',value:210},
			{name:'HDFS',value:190},
			{name:'YARN',value:190},
			{name:'MapReduce',value:190},
			{name:'Flume',value:180},
			{name:'Sqoop',value:170},
			{name:'Hive',value:180},
			{name:'Azkaban',value:175},
			{name:'Zookpeer',value:155},
			{name:'爬虫',value:210},
			{name:'Spark',value:195},
			{name:'大数据',value:500},
			{name:'Hbase',value:229},
			{name:'其他',value:60},
			{name:'Ajax',value:320},
			{name:'IDE',value:167},
			{name:'echarts',value:99},
			{name:'wordCloud',value:111},
			{name:'数据采集',value:68},
			{name:'数据分析',value:123},
			{name:'数据清洗',value:135},
			{name:'数据存储',value:135},
			{name:'数据可视化',value:165},
			{name:'apache',value:215},
			{name:'Scalar',value:220},
			{name:'人工智能',value:320},
			]
			var option = {
				title:{
					text:'词云',
					textStyle:{
						color:'#ffffff'
					}
				},
				backgroundColor:'#000',
				series:[{
					type:'wordCloud',

					//网格尺寸,尺寸越大，字体之间的间隔越大
					grideSize:2,

					//字体的最大与最小字号
					sizeRange:[12,35],
					
					//字体旋转的范围
					rotationRange:[45,90,135,-90],
					
					//词云形状 circle:圆形,pentagon:五边形
					//cardioid:苹果形或心形,star:星形,diamond:钻石,
					//triangle-forward:三角形,triangle:三角形,smooth:平滑
					shape:'pentagon',
					textStyle:{
						normal:{
							//字体随机颜色
							color:function(){
								return 'rgb('+[
									Math.round(Math.random()*255),
									Math.round(Math.random()*255),
									Math.round(Math.random()*255)
								].join(',')+')';
							}
						},
						emphasis:{
							//阴影距离
							shadowBlur:1,
							
							//阴影颜色
							shadowColor:'#111'
						}
					},
					data:data1
				}]
			};
			Mychart.setOption(option);
	</script>
</body>
</html>

效果图
在这里插入图片描述

温wen而雅

关注

1
点赞
踩
27

收藏

觉得还不错? 一键收藏
3
评论
echarts绘制词云图

<!DOCUMENT html><html><head><meta charset="utf-8"><title>词云</title><script src="echarts.js"></script><script src="echarts-wordcloud.js"><...
复制链接

扫一扫