1、安装插件
npm i echarts // echarts库
npm i echarts-wordcloud // 词云
2、引入，哪里用就在哪里引入即可
import * as echarts from 'echarts';
import 'echarts-wordcloud';
3、dom视图
4、核心代码 -->
test() {
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: 514,
},
{
name: "动漫",
value: 486,
},
{
name: "音乐",
value: 5999,
},
{
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,
},
{
name: "雇主类型",
value: 10,
},
{
name: "星座运势",
value: 789,
},
{
name: "星座",
value: 316,
},
{
name: "算命",
value: 303,
},
{
name: "解梦",
value: 196,
},
{
name: "风水",
value: 93,
},
{
name: "面相分析",
value: 47,
},
{
name: "手相",
value: 32,
},
{
name: "公益",
value: 90,
}
);
// 人像的base64编码
let image1 = `data:image/png;base64,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`;
var maskResource = new Image();
maskResource.src = image1;
var option = {
//设置标题，居中显示
title: {
text: "词云示例",
left: "center",
},
//数据可以点击
tooltip: {},
series: [
{
maskImage: maskResource,
//词的类型
type: "wordCloud",
//设置字符大小范围
sizeRange: [6, 50],
rotationRange: [-45, 90],
//不要忘记调用数据
data: jsonlist,
textStyle: {
// normal: {
//生成随机的字体颜色
color: function () {
return (
"rgb(" +
[
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
].join(",") +
")"
);
},
// },
},
},
],
};
//加载图像，将数据放在图像中
maskResource.onload = function () {
mycharts.setOption(option);
};
},// 全部代码如下
<template>
<div class="main">
<div id="main" style="width: 600px; height: 500px"></div>
<img src="@/assets/images/词云轮廓.svg" alt="" />
</div>
</template>
<script>
import * as echarts from "echarts";
import "echarts-wordcloud";
export default {
name: "DataviewIndex",
props: {},
components: {},
data() {
return {};
},
computed: {},
watch: {},
methods: {
test() {
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: 514,
},
{
name: "动漫",
value: 486,
},
{
name: "音乐",
value: 5999,
},
{
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,
},
{
name: "雇主类型",
value: 10,
},
{
name: "星座运势",
value: 789,
},
{
name: "星座",
value: 316,
},
{
name: "算命",
value: 303,
},
{
name: "解梦",
value: 196,
},
{
name: "风水",
value: 93,
},
{
name: "面相分析",
value: 47,
},
{
name: "手相",
value: 32,
},
{
name: "公益",
value: 90,
}
);
// 人像的base64编码
let image1 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACtWK6eAAAQmklEQVR4Xu2dCdSuUxXHf7hkjIWEXC6ZQ4ZcM5kryTzUJVaIjJEQZVjIlHnWMs9uIssURciUeapUkqEoSgmZrtv6f8693m94v+993+d53+fZ++y91re+y/c+5+z93+f/nuecs8/eUxBSJwSmAxYBFk0/i6XfCwFvAS8DTwGnAXfVSXGvukzh1bCa2/XJBhI0kmFeoFWfPAIcA1xZc1tNq9eqM0wbWZHyUwELDJgJRAbNCrOUqNNDwEHAz0tsM5pKCARByhkKGvDbAssBeh2aB/gUIJL0Sm4AdgFe7FWHOfQTBCnu5Z2B44CZijdVuIU3gYOBk4APCrcWDbT8vhtQDUZgBuBIYK8agqPXrnHA0zXUzZRKMYMMdtf8aZ0wBlgQWByYFngV+DGwbPr/GwBabNdV3gUOSQv5iXVVsu565U4Q2b8GsDawWlpDzFh3p7Wp3+3AV4G/t/lcfLyNLUVvYI0C9kivR/N5M24Ie14B9gEuycDWUk3McQYZmwaKdptyEx0ungzcDGhBHzICArkRZBvgXGCazEfGe8DDwNvA9MAygGbVRtEa5hngT+nnNuAmYEJO2OVEEL2HX5rxa2UZ41qhLucAZ6awlzLarHUbuRBksxSS0cuDu1o7vqByigvbDzi9YDu1fzwHgnwBuL7Hp9q1d3xJCp4P7AC43Ub2ThBt2eo9eo6SBkQ0MxiBH6ZYMJfYeCfIWYBCQUK6h4BCWlYG7u9eF9W17JkgOvi7szpos+pZofcK1HT3quWZIHLa0lkN02qN3RIYX60K5ffulSDrAreUD1e0OAwCtwLreUPIK0G0a6VgwpDeIaDXK92IdHUfxSNBRgPPxYFg75jR0NO+wPGV9NylTj0S5HuAth5Deo/A1cDmve+2ez16JMjjwJLdgyxaHgaB5wFX0dHeCLJw3KKrnMA6nHUTKeyNILrz4OoduPLh3r4COjS8t/3H6vmEN4JcC2xUT6iz0UpXChQ17UK8EeRvwFwuPGPXiAOBo+yq319zTwSZLSVW8OIbq3YoBH53q8oP1NsTQVaNfLW1GJaXpZRDtVCmqBKeCLIFcFVRQOL5wgjc6CmKwRNBFNau8PaQahHQDpZ2slyIJ4Ic4GlxaHh0PQEsZVj/fqp7IojCSxRmElItAtpJVOJuF+KJIMr3tKcLr9g24p2UqtW2FUl7TwRROpqdXHjFvhFuwk08EeRiQKe4IdUjoIBFBS6aF08EUSkyXfsMqR4BRVM/Wb0axTXwRJCIwyo+HspqwU3AoieCqATZl8rycLRTCAEl63NRM9ETQZSkQckaQqpHYBNAM7p58UQQZR9f07xHfBjwNeByD6Z4IsgdwOoenOLABuXrPc+BHa6KeP4aWMWDUxzYsBtwhgM7XBHkbk9BcsYHl+6DuCiN4OkV6x5gJeMDy4v6Ko19igdjPBFEYdYrenCKAxuUPONEB3a4esUKgtRnRLrJsBgzSH0GlSdN9gZO8mCQJ4LEGqQ+IzLWIPXxxWRN4hykPk6JXaz6+GKyJrcDn6+hXjmqtGOqR2/edk+vWCrgso55j/gwYByg9D/mxRNBbgIURRpSPQKbAtdUr0ZxDTwR5Dpgw+KQRAslILAWoFde8+KJIHGjsD7D8bOA6rSYF08EuRD4unmP+DBAaX+U/se8eCLImcAu5j1i34BI+1NTHyq84bia6paTWg8Dy3kx2NMMsoeXCFLjg+sSYFvjNkxW3xNBLgC28+IYw3ZEfZAaOk9T+n3AqBrqlptKDwFjgQ88GG55BtHdD+23fzFdtbVsi4ex1GiDUv7oC+tZ4CeWq95aHVT7A0d7G1VO7Xk1RThoZjEnFgmyQiozbFF3cwOkJIX/DcwP6LcpsTjILvK0S2JqtBRT9lSL5SmsEUT6vgbMXMxX8XQFCLwJzA68XUHfHXdpjSDLADqICrGJwEaAgkrNiDWCKKXlpWbQDUUHInAk8H1LsFgjiGoQqhZhiE0Ebk7b8ma0t0YQxVop5irEJgJ/ABaxpLo1gpwNfNMSwKFrPwQmAFMDE63gYo0g5wPbWwE39BwSAe1Avm4FG2sEiTMQKyOruZ6mCnxaI0hE7NonyBLAU1bMsEYQ1Zz4lhVwQ88hEdBZ1qNWsLFGkNjFsjKymuupUPgHrJhhjSAHAUdYATf0HBKB5YEHrWBjjSA7A2dZATf0HBKBJYEnrWBjjSDK2He1FXBDzyERWBB4xgo21giiIp0q1hliF4G5gJetqG+NIGPSNU4r+IaegxH4GPCuFWCsEURJGd5K4QpWMA49P0JAd0JmtASINYII298Ci1kCOXSdjIC5pHIWCaJFuhbrIfYQOAw41JLaFgnyI+A7lkAOXfsQeB+YF3jJEh4WCaJoXkX1hthCQFVvVf3WlFgkyNzAi+CqxrupQdOBsqrdouvS5rItWiSI/KOrm+t34Kh4pPcIKLPi1oAuS5kTqwTRtU3F85jaMjQ3Ooop/B9gH+C8Ys1U+7RVggg1lXzWt9Ns1UIYvQ+BwK8AVbo1X2XKMkHkl3lSueHVYpjWAoEXgAO8lIAWotYJMskGRfkeC8xUi2GSnxLKlng4cIK1zIkjucoDQSbZOEvaKdkBWHYkw+PvpSGg+vTKNKOdRXfiiSCNzlGKy2vdeat+Br0HfALQgtyleCWInPXnlHLfpeNqYtR4YMua6NIVNTwTZD/gmK6gFo1OQmBt4DbPcHgmiM5ItKuitUlI+QiYi8ztBALPBBEeihw9pBNg4pkREdgkh3Wed4JMBzwNjB7R3fGBdhB4DFi6nQesftY7QeSXjYFrrDqopnpvCFxfU91KVSsHgggwRZO63m0pdVQM39jtqfx2D7usrqtcCDIr8EdAv0M6R0An5p9JW+idt2LoyVwIIpesA6jA/ZSG/FM3VZXZMqsKXzkRRIMtzkY6p9zvgKXS1dnOWzH2ZG4EkXuuALYy5qeq1VUeK8W3mSlbUBZgORJEict0X2HFskDMoJ1dgTMzsHOQiTkSRCDodF0pTLXgDBkeASXI+EauIOVKEPlbNxHvARbO1fkt2K0vEd3cNHmfvAX7RvxIzgQROMqQop0tlQUL6Y+AIhBWBv6VMzC5E0S+nxY4N122ynksNNquIE+t0czfKS/q0CDIhwjqbOR0YJeigDp4XiWaVwB+78CWwiYEQfpDqLgtzSa5nri/kQ5U7y88spw0EAQZ7EitS1TmTQF5OYmK2igZ3+M5GT2SrUGQ5gjtBSifbA7yRMp+qNISIQ0IBEGaD4c5rWUi73BkKwBR+cX+2eHzrh8LgjR37wyA3sm9i2YPxViFDIFAEKT5sJgqk8C8rO53tPstEAQZHrF3gGnaBdXY51Wxa3NjOvdM3SBIc6h1NqL386l75o1qOtLZz9nVdF3/XoMgw/tI4d2L19+NHWuogjazA6913ILzB4Mgwzv4YmAbx2PgUWAZx/YVNi0IMjyEBwOqzOpVzgGUGT+kCQJBkOGHxh7AKY5Hj74AVLYgJAjS0Rj4NnBiR0/aeCgW6CP4KWaQ4QE6PtXZszHc29cy26u0rUIVBBkeKd2oW6VVMA1+TtnvVTItJF6x2h4DH0+36XSi7lX0BRD1HYfxbswgzcFRkrQjvDIj2TUxFRl6zrmdHZsXBBkaOpUVeyaToqDxmhUzSFtfIAoxUTb4r7T1lN0Pv5WSVjxr14TuaR4zSH9std64EBjXPchr2bIymCwP/LeW2lWoVBDkI/BVbEeVcder0B9Vdv0IsG5cnOrvgiDIh3ioApVqiKxU5QitQd/Pp4JDIksIkDtBpk8HgdqxUn6sEFDt86PSDp7+nbXkShARQ0F6B6Zw76wHQRPjVXBo/9zL1+VEENmqheimKUHczMGKlhBQXRCF/V8GZHde4p0gsm/VdKdDZYt1vhHSOQKqja4t8BsBrVN00OhaPBFEtqicgX4WTT+Ko4oS0N0Zwq8AtwC3AUr84PIcxSpBRgGLpHQ1uhH3OWAsoFQ9IdUgoCzwOk/RjxLQKZ2QsjSaToBthSCaFdYClkuk0H97zzZSzTAvv9dXE1H0SnZfmm3MJKmrK0HmAzZIxVtUwCXWDuUP3Kpa1LpFyTBUBk+vZqrP8mZVyozUb50IovQ6in/aMSVRrpNuI+EYf+8cAaVWugm4CrgOUGxYbaQOg1B5YXX3W3XwlIImJF8ERJafpmvOD9YBhioJovJeuvOtcwnPl5Lq4GeLOmi9onwAIsz7VRlQBUFUvejkVMWoKrujXzsI6ER/vxRI2nOte0mQ+YGjgS17bmV06AGBu4HdASW765n0giDajv1B+haIrdmeudZlR0qVemwaTz157eo2QVQp9SJgIZfuCqOqQkBnKlsBev3qqnSLILq2qgWWdqe61UdXgYnGa4+Adrx0JHBpNzXtxuBVuhwFtOnkOyQQ6DYC+iL+LjChGx2VTZAFgZuBT3dD2WgzEGiCwC8BRWuXfqe+TIIsCfwCmCPcGAhUgICCI9cB/lFm32URRId+mjlmKlO5aCsQaBOBvySSKKdZKVIGQRRhq8CzGUvRKBoJBIoh8ELKp6zfhaUoQRYD7gXi+mphV0QDJSKgmWR1oDBJihBkznTtUr9DAoG6IaC79DqHe72IYp0SREnWFEwWBeiLoB/PdhuBO4C1i2wBd0qQK9JJZrcNjPYDgaIInArs2WkjnRBkJ0DFH0MCASsIbAz8rBNl2yWIaoY/FFkIO4E6nqkQAR0gKrlH29u/7RBEqTmVF0k7VyGBgDUEHkuJA9tKp9oOQc6KmtrWxkToOwCBM4Dd2kGlVYIo8FDxLiGBgHUEtKulZHctSSsEUTI2pWlRKp6QQMA6Ai+m44nXWjGkFYJcAGzXSmPxmUDACAK6vrsmH5Z6GFZGIsgWKV/RSO3E3wMBawgocYiy6nRMEOW+VW6iCEIcCcX4u1UEtk6VxZrq32wGUQiJ0kLOatXy0DsQaAGBd1NdxjubfXYogogUunwydwsdxEcCAesIaLGuKxtDlm8YiiDnA9tbtzr0DwTaQECLdhVaGiQDCaJTcm3pjrR4b6Pv+GggYAKBLwM3DNR0IBEUhKhgxJBAIDcEdCtWW7/9pJEgynqo9zFVgA0JBHJEQIlHnmw0vJEg66aaczkCEzYHAkLgGOCAZgQ5Dtg3cAoEMkbg+YEhVY0zyG9SOHDG+ITpgUBflWQVIe2TSQRRQKIulcTuVYyQ3BFQOLzC4vsRRInftBccEgjkjsD4xho2k2aMXYHTc0cm7A8EUi6teQfOIKe1e9MqoAwEHCOgwrJ/bVyDKOm0blqFBAKBAGyWiodOXpRre2t0IBMIBAJ9CBwOHDxpBhnVys2qAC4QyAgBxWQpNqtvBlmgk3xBGYEVpuaHgJJe9y3URZA1UvmC/GAIiwOB5gio1s0bIoiuHV4eSAUCgUA/BMYCD4ggewMnBDiBQCDQD4FxwGUiyJHAgQFOIBAI9EPgUOAwESRSisbICAQGI3AJsK0IcmVj7EkgFQgEAn0I3KUybiKIqtOuH6AEAoFAPwQUajKPCKIoXkXzhgQCgcBHCEwEphJBlANriUAmEAgEBiEwWgRRwqwxAU4gEAgMQmBFEeQlIEo5x+gIBAYjsLEIolQ/swQ6gUAgMAiBXUWQ/0VRzhgagcCQCBwqgqiIiELeQwKBQKA/AmeIIBOAKQOZQCAQGITAeBFE+70hgUAgMBiBW/8PLAMCa7j6evUAAAAASUVORK5CYII=`;
var maskResource = new Image();
maskResource.src = image1;
var option = {
//设置标题，居中显示
title: {
text: "词云示例",
left: "center",
},
//数据可以点击
tooltip: {},
series: [
{
maskImage: maskResource,
//词的类型
type: "wordCloud",
//设置字符大小范围
sizeRange: [6, 50],
rotationRange: [-45, 90],
//不要忘记调用数据
data: jsonlist,
textStyle: {
// normal: {
//生成随机的字体颜色
color: function () {
return (
"rgb(" +
[
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
Math.round(Math.random() * 160),
].join(",") +
")"
);
},
// },
},
},
],
};
//加载图像，将数据放在图像中
maskResource.onload = function () {
mycharts.setOption(option);
};
},
},
created() {},
mounted() {
this.test();
},
};
</script>
<style scoped lang='scss'>
.main {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
// background-color: rgb(221, 189, 189);
}
#main {
// background-color: rgb(128, 94, 94);
}
</style>
2668
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
