词云图渲染卡顿

[qinyouzhi]

• [ ] I have searched the issues of this repository and believe that this is not a duplicate.

What problem does this feature solve?

词云图200 数据会导致渲染卡顿，页面操作也会卡顿，这个怎么优化比较好？

What does the proposed API look like?

可以达到大数据量词云图渲染

[hustcc]

@qinyouzhi 我在官网测试了一下 200 条数据，好像不会卡住，方便把你的数据给我一下嘛？我感觉应该是某个数据异常导致的代码死循环了。

[qinyouzhi]

用的是G2 plot的遮罩词云

[qinyouzhi]

@hustcc 发给您的数据有问题吗

[hustcc]

@hustcc 发给您的数据有问题吗

你发到哪里的？我好像没有看到～

[qinyouzhi]

@hustcc 发给您的数据有问题吗

你发到哪里的？我好像没有看到～

发你邮箱了 [{"i":"DD2021093009893065908153102336","x":"上海市 上海市 嘉定区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 宝山区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 徐汇区","y":6,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 普陀区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 杨浦区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 松江区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 浦东新区","y":7,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 虹口区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 金山区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 长宁区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 闵行区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 静安区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"上海市 上海市 黄浦区","y":9,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"云南省 昆明市 官渡区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"内蒙古自治区 包头市 东河区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"内蒙古自治区 呼和浩特市 玉泉区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 东城区","y":27,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 丰台区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 宣武区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 崇文区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 昌平区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 朝阳区","y":9,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 海淀区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 石景山区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 西城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 通州区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 门头沟区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"北京市 北京市 顺义区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"吉林省 四平市 双辽市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"吉林省 长春市 南关区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"吉林省 长春市 朝阳区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 宜宾市 翠屏区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 德阳市 旌阳区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 双流县","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 成华区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 武侯区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 金牛区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 锦江区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 青羊区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 高新区","y":5,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 成都市 龙泉驿区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 攀枝花市 西 区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"四川省 绵阳市 江油市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"天津市 天津市 南开区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"天津市 天津市 和平区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"天津市 天津市 河西区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 合肥市 东市区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 合肥市 中市区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 合肥市 肥东县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 合肥市 长丰县","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 蚌埠市 西市区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"安徽省 阜阳市 颍州区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 东营市 东营区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 临沂市 临沭县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 临沂市 罗庄区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 济南市 历下区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 济南市 天桥区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 济南市 章丘市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 济宁市 市中区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 淄博市 博山区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 淄博市 淄川区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 滨州市 滨城区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 潍坊市 青州市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 青岛市 城阳区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 青岛市 市北区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山东省 青岛市 市南区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 临汾市 尧都区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 吕梁市 孝义市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 大同市 城 区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 太原市 万柏林区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 太原市 小店区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 太原市 迎泽区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 忻州市 忻府区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 晋城市 陵川县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 运城市 万荣县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"山西省 长治市 长治县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 中山市 南区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 佛山市 南海市","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 佛山市 高明市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 东山区","y":5,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 天河区","y":6,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 海珠区","y":4,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 番禺区","y":7,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 白云区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 花都区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 荔湾区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 广州市 越秀区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 惠州市 惠城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 揭阳市 揭西县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 汕头市 金园区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 汕头市 龙湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 深圳市 南山区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 深圳市 宝安区","y":4,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 深圳市 福田区","y":4,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 深圳市 罗湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 深圳市 龙岗区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 珠海市 香洲区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广东省 肇庆市 端州区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广西壮族自治区 柳州市 鱼峰区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广西壮族自治区 桂林市 叠彩区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"广西壮族自治区 桂林市 象山区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 六合县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 栖霞区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 江宁区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 浦口区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 玄武区","y":4,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 秦淮区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 南京市 鼓楼区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 徐州市 沛 县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 徐州市 鼓楼区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 扬州市 邗江区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 无锡市 锡山区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 泰州市 兴化市","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 淮安市 涟水县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 苏州市 吴中区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 苏州市 昆山市","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 苏州市 相城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江苏省 连云港市 赣榆县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 南昌市 东湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 南昌市 西湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 南昌市 进贤县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 南昌市 青云谱区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 宜春市 丰城市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"江西省 新余市 渝水区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 保定市 南市区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 唐山市 路北区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 廊坊市 廊坊市广阳区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 张家口市 万全县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 承德市 双桥区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 沧州市 南皮县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 石家庄市 桥西区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 石家庄市 长安区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 衡水市 景 县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河北省 邯郸市 丛台区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 新乡市 新华区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 洛阳市 老城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 漯河市 源汇区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 郑州市 中原区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 郑州市 二七区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 郑州市 金水区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"河南省 驻马店市 驿城区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 嘉兴市 秀洲区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 宁波市 北仑区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 杭州市 上城区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 杭州市 下城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 杭州市 余杭市","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 杭州市 西湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 温州市 瓯海区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 温州市 苍南县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 湖州市 长兴县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 绍兴市 越城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"浙江省 金华市 金东区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"海南省 海口市 秀英区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 武汉市 东西湖区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 武汉市 武昌区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 武汉市 江岸区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 武汉市 洪山区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 武汉市 蔡甸区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 襄樊市 老河口市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 随州市 曾都区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 黄冈市 罗田县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖北省 黄石市 阳新县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 株洲市 荷塘区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 郴州市 北湖区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 郴州市 苏仙区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 长沙市 岳麓区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 长沙市 长沙县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"湖南省 长沙市 雨花区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"甘肃省 兰州市 七里河区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"甘肃省 兰州市 西固区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 厦门市 思明区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 泉州市 晋江市","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 漳州市 芗城区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 福州市 台江区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 福州市 马尾区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"福建省 福州市 鼓楼区","y":3,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"贵州省 贵阳市 南明区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"贵州省 贵阳市 白云区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"贵州省 贵阳市 花溪区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 大连市 沙河口区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 大连市 甘井子区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 大连市 金州区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 朝阳市 双塔区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 沈阳市 和平区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 沈阳市 大东区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 沈阳市 新城子区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"辽宁省 沈阳市 皇姑区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"重庆市 重庆市 九龙坡区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"重庆市 重庆市 奉节县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"重庆市 重庆市 涪陵区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"重庆市 重庆市 渝中区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"重庆市 重庆市 渝北区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"陕西省 汉中市 汉台区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"陕西省 西安市 新城区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"陕西省 西安市 碑林区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"陕西省 西安市 长安县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"陕西省 西安市 雁塔区","y":2,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"青海省 西宁市 城北区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"黑龙江省 佳木斯市 桦南县","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"黑龙江省 哈尔滨市 南岗区","y":1,"t":"投放类型","s":null,"percent":null},{"i":"DD2021093009893065908153102336","x":"黑龙江省 哈尔滨市 阿城市","y":1,"t":"投放类型","s":null,"percent":null}]

[hustcc]

@qinyouzhi 求顺便发一下代码

[qinyouzhi]

@qinyouzhi 求顺便发一下代码

import React, { FC, useEffect, useRef } from 'react';
import { useUpdateLayoutEffect } from 'ahooks';
interface WordCloudProps{
  id: string,
  data?: Array<{ x: string | number, y: string | number, t: string }>
    config?: any,
}

const charts: any = {};
const WordCloud: FC<WordCloudProps> = (props) => {
  const { id, data = [], config } = props;
  const { style } = config;
  const ref = useRef<any>();
  const colors = style.paletteQualitative.split('-');

  const initChart = () => {
    if (data.length) {
      const ds = new window.DataSet();
      const dv = ds.createView().source(data).transform({
        type: 'map',
        callback(row) {
          row.word = row.x.length > 6 ? row.x.slice(0, 6) + '...' : row.x;
          return row;
        }
      });

      charts[id] && charts[id].destroy();
      charts[id] = new window.G2Plot.WordCloud(id, {
        data: dv.rows,
        wordField: 'word',
        weightField: 'y',
        colorField: 'x',
        spiral: 'rectangular',
        imageMask: `https://cdn.cempro.cn/cem-web/images/dashboard/word_cloud_cloud.png`,
        wordStyle: {
          fontFamily: 'Verdana',
          fontSize: [10, 32],
          rotation: 0,
          padding: 2
        },
        color: colors,
        tooltip: {
          customContent: (title, data) => {
            if (data.length) {
              const { data: { datum: { percent, t, x, y } }, mappingData: { color } } = data[0];
              return `<li class="g2-tooltip-list-item" data-index={index} style="margin-bottom:4px;">
                <span style="background-color:${color};" class="g2-tooltip-marker"></span>
                ${x}<br/><br/>
                ${t}: ${percent ? percent?.toFixed(2) + '%' : y}
              </li>`
            }
            return null;
          }
        },
        interactions: [{ type: 'element-active' }],
        state: {
          active: {
            style: {
              lineWidth: 1,
            },
          },
        },
        random: 0.5
      });

      charts[id].render();
    }
  }

  useEffect(() => {
    initChart()
  }, []);

    useUpdateLayoutEffect(() => {
    initChart();
  }, [data, config]);

    return (
        <div ref={ref} id={id} style={{ width: '100%', height: '100%' }}></div>
    )
}

export default WordCloud;

[hustcc]

不实用 dataset 可以吗，G2Plot 可以直接使用 json 数组。

[qinyouzhi]

不实用 dataset 可以吗，G2Plot 可以直接使用 json 数组。

是dataset影响的卡顿吗，dataset只是map一下数据， 可以不用 直接用for

[qinyouzhi]

不实用 dataset 可以吗，G2Plot 可以直接使用 json 数组。

你好 有好的解决办法了吗

[pearmini]

可以试试 G2 5.0 的词云图：https://g2.antv.antgroup.com/examples/general/text/#wordCloud-english