一、什么是词云
1.词云的简介
词云,又称文字云,英文名:Word Cloud。是文本数据的视觉表示形式。就是对指定范围文本中出现频率较高的“关键词”予以视觉上的突出表现,从而过滤掉大量的文本信息,形成“关键词云层”或“关键词渲染”,使浏览网页者只要一眼扫过文本就可以领略文本的主题宗旨。
2.词云实现原理
某个词云就是指定文章内的关键字集合体。一篇文章我们可以拆分成多个关键词,然后把每个单词出现的频率进行统计
3. 实现词云的方式
二、词云图的特点
目前主要有两种词云的实现库,一个是最基础的词云wordcloud,另一个是基于wordcloud实现的stylecloud。
词云图是一种数据可视化技术,它通过将文本数据中的单词按照其频率或重要性进行排列,并以不同大小或颜色展示,以便于观察和分析。以下是词云图的特点:
- 视觉冲击力强。词云图通常具有较高的视觉吸引力,能够快速抓住观众的注意力,这使得它在展示大量文本数据时尤为有效。
- 内容直接。词云图是对文本内容的高度浓缩和精简处理,能够直观地反映特定文本的内容,帮助读者快速理解文本的主题、关键概念或主要内容。
- 应用范围广泛。词云图可以应用于用户画像、舆情分析等多种场景,并且可以轻松地嵌入到PPT报告、数据分析类产品或可视化大屏中。
- 制作简单。即使没有深厚的数据处理技术背景,也能制作出有效的词云图,这使得它成为一种易于使用的工具。
- 趣味性强。可以通过调整颜色深浅、气泡大小等来直观地展示数据的数值大小,还可以根据实际需要调整词云的形状,使其具有有趣和直观的效果。
- 存在信息缺失问题。词云图仅展示词汇,而缺少了文本的上下文和逻辑结构,这可能导致信息的不完整性。
- 缺乏逻辑性。词云图由词汇、颜色、字体大小和图形组成,虽然具有视觉吸引力,但失去了文本原有的内在逻辑结构,需要读者将高频词汇串联起来形成联想。
三、代码实现
1.引用配置文件
需要的js文件:
echarts.js
echarts-wordcloud.min.js
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>词云图</title>
<script type="text/javascript" src="js/echarts.js"></script>
<script type="text/javascript" src="js/echarts-wordcloud.min.js"></script>
</head>
2.配置一个div盒子
<div id="main" style="width: 600px;height: 500px; "></div>
3.所有代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>词云图</title>
<script type="text/javascript" src="js/echarts.js"></script>
<script type="text/javascript" src="js/echarts-wordcloud.min.js"></script>
</head>
<body>
<div id="main" style="width: 600px;height: 500px; "></div>
<script >
var mycharts = echarts.init(document.getElementById("main"));
//用来存储数据
var jsonlist = [];
jsonlist.push(
{
"name": "花鸟市场",
"value": 1446
},
{
"name": "汽车",
"value": 928
},
{
"name": "视频",
"value": 906
},
{
"name": "电视",
"value": 825
},
{
"name": "Lover Boy 88",
"value": 399
},
{
"name": "动漫",
"value": 486
},
{
"name": "崩溃",
"value": 50032
},
{
"name": "直播",
"value": 163
},
{
"name": "广播电台",
"value": 86
},
{
"name": "戏曲曲艺",
"value": 17
},
{
"name": "演出票务",
"value": 6
},
{
"name": "给陌生的你听",
"value": 1
},
{
"name": "资讯",
"value": 1437
},
{
"name": "商业财经",
"value": 422
},
{
"name": "娱乐八卦",
"value": 353
},
{
"name": "军事",
"value": 331
},
{
"name": "科技资讯",
"value": 313
},
{
"name": "社会时政",
"value": 307
},
{
"name": "时尚",
"value": 43
},
{
"name": "网络奇闻",
"value": 15
},
{
"name": "旅游出行",
"value": 438
},
{
"name": "景点类型",
"value": 957
},
{
"name": "国内游",
"value": 927
},
{
"name": "远途出行方式",
"value": 908
},
{
"name": "酒店",
"value": 693
},
{
"name": "关注景点",
"value": 611
},
{
"name": "旅游网站偏好",
"value": 512
},
{
"name": "出国游",
"value": 382
},
{
"name": "交通票务",
"value": 312
},
{
"name": "旅游方式",
"value": 187
},
{
"name": "旅游主题",
"value": 163
},
{
"name": "港澳台",
"value": 104
},
{
"name": "本地周边游",
"value": 3
},
{
"name": "小卖家",
"value": 1331
},
{
"name": "全日制学校",
"value": 941
},
{
"name": "基础教育科目",
"value": 585
},
{
"name": "考试培训",
"value": 473
},
{
"name": "语言学习",
"value": 358
},
{
"name": "留学",
"value": 246
},
{
"name": "K12课程培训",
"value": 207
},
{
"name": "艺术培训",
"value": 194
},
{
"name": "技能培训",
"value": 104
},
{
"name": "IT培训",
"value": 87
},
{
"name": "高等教育专业",
"value": 63
},
{
"name": "家教",
"value": 48
},
{
"name": "体育培训",
"value": 23
},
{
"name": "职场培训",
"value": 5
},
{
"name": "金融财经",
"value": 1328
},
{
"name": "银行",
"value": 765
},
{
"name": "股票",
"value": 452
},
{
"name": "保险",
"value": 415
},
{
"name": "贷款",
"value": 253
},
{
"name": "基金",
"value": 211
},
{
"name": "信用卡",
"value": 180
},
{
"name": "外汇",
"value": 138
},
{
"name": "P2P",
"value": 116
},
{
"name": "贵金属",
"value": 98
},
{
"name": "债券",
"value": 93
},
{
"name": "网络理财",
"value": 92
},
{
"name": "信托",
"value": 90
},
{
"name": "征信",
"value": 76
},
{
"name": "期货",
"value": 76
},
{
"name": "公积金",
"value": 40
},
{
"name": "银行理财",
"value": 36
},
{
"name": "银行业务",
"value": 30
},
{
"name": "典当",
"value": 7
},
{
"name": "海外置业",
"value": 1
},
{
"name": "汽车",
"value": 1309
},
{
"name": "汽车档次",
"value": 965
},
{
"name": "汽车品牌",
"value": 900
},
{
"name": "汽车车型",
"value": 727
},
{
"name": "购车阶段",
"value": 461
},
{
"name": "二手车",
"value": 309
},
{
"name": "汽车美容",
"value": 260
},
{
"name": "新能源汽车",
"value": 173
},
{
"name": "汽车维修",
"value": 155
},
{
"name": "租车服务",
"value": 136
},
{
"name": "车展",
"value": 121
},
{
"name": "违章查询",
"value": 76
},
{
"name": "汽车改装",
"value": 62
},
{
"name": "汽车用品",
"value": 37
},
{
"name": "路况查询",
"value": 32
},
{
"name": "汽车保险",
"value": 28
},
{
"name": "陪驾代驾",
"value": 4
},
{
"name": "网络购物",
"value": 1275
},
{
"name": "做我的猫",
"value": 1088
},
{
"name": "只想要你知道",
"value": 907
},
{
"name": "团购",
"value": 837
},
{
"name": "比价",
"value": 201
},
{
"name": "海淘",
"value": 195
},
{
"name": "移动APP购物",
"value": 179
},
{
"name": "支付方式",
"value": 119
},
{
"name": "代购",
"value": 43
},
{
"name": "体育健身",
"value": 1234
},
{
"name": "体育赛事项目",
"value": 802
},
{
"name": "运动项目",
"value": 405
},
{
"name": "体育类赛事",
"value": 337
},
{
"name": "健身项目",
"value": 199
},
{
"name": "健身房健身",
"value": 78
},
{
"name": "运动健身",
"value": 77
},
{
"name": "家庭健身",
"value": 36
},
{
"name": "健身器械",
"value": 29
},
{
"name": "办公室健身",
"value": 3
},
{
"name": "商务服务",
"value": 1201
},
{
"name": "法律咨询",
"value": 508
},
{
"name": "化工材料",
"value": 147
},
{
"name": "广告服务",
"value": 125
},
{
"name": "会计审计",
"value": 115
},
{
"name": "人员招聘",
"value": 101
},
{
"name": "印刷打印",
"value": 66
},
{
"name": "知识产权",
"value": 32
},
{
"name": "翻译",
"value": 22
},
{
"name": "安全安保",
"value": 9
},
{
"name": "公关服务",
"value": 8
},
{
"name": "商旅服务",
"value": 2
},
{
"name": "展会服务",
"value": 2
},
{
"name": "特许经营",
"value": 1
},
{
"name": "休闲爱好",
"value": 1169
},
{
"name": "收藏",
"value": 412
},
{
"name": "摄影",
"value": 393
},
{
"name": "温泉",
"value": 230
},
{
"name": "博彩彩票",
"value": 211
},
{
"name": "美术",
"value": 207
},
{
"name": "书法",
"value": 139
},
{
"name": "DIY手工",
"value": 75
},
{
"name": "舞蹈",
"value": 23
},
{
"name": "钓鱼",
"value": 21
},
{
"name": "棋牌桌游",
"value": 17
},
{
"name": "KTV",
"value": 6
},
{
"name": "密室",
"value": 5
},
{
"name": "采摘",
"value": 4
},
{
"name": "电玩",
"value": 1
},
{
"name": "真人CS",
"value": 1
},
{
"name": "轰趴",
"value": 1
},
{
"name": "家电数码",
"value": 1111
},
{
"name": "手机",
"value": 885
},
{
"name": "电脑",
"value": 543
},
{
"name": "大家电",
"value": 321
},
{
"name": "家电关注品牌",
"value": 253
},
{
"name": "网络设备",
"value": 162
},
{
"name": "摄影器材",
"value": 149
},
{
"name": "影音设备",
"value": 133
},
{
"name": "办公数码设备",
"value": 113
},
{
"name": "生活电器",
"value": 67
},
{
"name": "厨房电器",
"value": 54
},
{
"name": "智能设备",
"value": 45
},
{
"name": "个人护理电器",
"value": 22
},
{
"name": "服饰鞋包",
"value": 1047
},
{
"name": "服装",
"value": 566
},
{
"name": "饰品",
"value": 289
},
{
"name": "鞋",
"value": 184
},
{
"name": "箱包",
"value": 168
},
{
"name": "奢侈品",
"value": 137
},
{
"name": "母婴亲子",
"value": 1041
},
{
"name": "孕婴保健",
"value": 505
},
{
"name": "母婴社区",
"value": 299
},
{
"name": "早教",
"value": 103
},
{
"name": "奶粉辅食",
"value": 66
},
{
"name": "童车童床",
"value": 41
},
{
"name": "关注品牌",
"value": 271
},
{
"name": "宝宝玩乐",
"value": 30
},
{
"name": "母婴护理服务",
"value": 25
},
{
"name": "纸尿裤湿巾",
"value": 16
},
{
"name": "妈妈用品",
"value": 15
},
{
"name": "宝宝起名",
"value": 12
},
{
"name": "童装童鞋",
"value": 9
},
{
"name": "胎教",
"value": 8
},
{
"name": "宝宝安全",
"value": 1
},
{
"name": "宝宝洗护用品",
"value": 1
},
{
"name": "软件应用",
"value": 1018
},
{
"name": "系统工具",
"value": 896
},
{
"name": "理财购物",
"value": 440
},
{
"name": "生活实用",
"value": 365
},
{
"name": "影音图像",
"value": 256
},
{
"name": "社交通讯",
"value": 214
},
{
"name": "手机美化",
"value": 39
},
{
"name": "办公学习",
"value": 28
},
{
"name": "应用市场",
"value": 23
},
{
"name": "母婴育儿",
"value": 14
},
{
"name": "游戏",
"value": 946
},
{
"name": "手机游戏",
"value": 565
},
{
"name": "PC游戏",
"value": 353
},
{
"name": "网页游戏",
"value": 254
},
{
"name": "游戏机",
"value": 188
},
{
"name": "模拟辅助",
"value": 166
},
{
"name": "个护美容",
"value": 942
},
{
"name": "护肤品",
"value": 177
},
{
"name": "彩妆",
"value": 133
},
{
"name": "美发",
"value": 80
},
{
"name": "香水",
"value": 50
},
{
"name": "个人护理",
"value": 46
},
{
"name": "美甲",
"value": 26
},
{
"name": "SPA美体",
"value": 21
},
{
"name": "花鸟萌宠",
"value": 914
},
{
"name": "绿植花卉",
"value": 311
},
{
"name": "狗",
"value": 257
},
{
"name": "其他宠物",
"value": 131
},
{
"name": "水族",
"value": 125
},
{
"name": "猫",
"value": 122
},
{
"name": "动物",
"value": 81
},
{
"name": "鸟",
"value": 67
},
{
"name": "宠物用品",
"value": 41
},
{
"name": "宠物服务",
"value": 26
},
{
"name": "书籍阅读",
"value": 913
},
{
"name": "网络小说",
"value": 483
},
{
"name": "关注书籍",
"value": 128
},
{
"name": "文学",
"value": 105
},
{
"name": "报刊杂志",
"value": 77
},
{
"name": "人文社科",
"value": 22
},
{
"name": "建材家居",
"value": 907
},
{
"name": "装修建材",
"value": 644
},
{
"name": "家具",
"value": 273
},
{
"name": "家居风格",
"value": 187
},
{
"name": "家居家装关注品牌",
"value": 140
},
{
"name": "家纺",
"value": 107
},
{
"name": "厨具",
"value": 47
},
{
"name": "灯具",
"value": 43
},
{
"name": "家居饰品",
"value": 29
},
{
"name": "家居日常用品",
"value": 10
},
{
"name": "生活服务",
"value": 883
},
{
"name": "物流配送",
"value": 536
},
{
"name": "家政服务",
"value": 108
},
{
"name": "摄影服务",
"value": 49
},
{
"name": "搬家服务",
"value": 38
},
{
"name": "物业维修",
"value": 37
},
{
"name": "婚庆服务",
"value": 24
},
{
"name": "二手回收",
"value": 24
},
{
"name": "鲜花配送",
"value": 3
},
{
"name": "维修服务",
"value": 3
},
{
"name": "殡葬服务",
"value": 1
},
{
"name": "求职创业",
"value": 874
},
{
"name": "创业",
"value": 363
},
{
"name": "目标职位",
"value": 162
},
{
"name": "目标行业",
"value": 50
},
{
"name": "兼职",
"value": 21
},
{
"name": "期望年薪",
"value": 20
},
{
"name": "实习",
"value": 16
},
);
// 人像的base64编码
image1= "data:image/png;base64,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"
var maskResource = new Image()
maskResource.src=image1;
var option ={
//设置标题,居中显示
title:{
text: 'E词云图',
left:'center',
},
//数据可以点击
tooltip:{
},
series:[
{
maskImage:maskResource,
//词的类型
type: 'wordCloud',
//设置字符大小范围
sizeRange:[6,78],
rotationRange:[-45,90],
textStyle: {
normal:{
//生成随机的字体颜色
color:function () {
return 'rgb(' + [
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160)
].join(',')+')';
}
}
},
//不要忘记调用数据
data:jsonlist
}
]
};
//加载图像,将数据放在图像中
maskResource.onload = function(){
mycharts.setOption(option)
};
</script>
</body>
</html>
(该爱心形状需要转化为base64格式)
image1= "data:image/png;base64,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"
var maskResource = new Image()
maskResource.src=image1;
四、效果图