echarts4.0使用wordCloud的方法(支持彩色字体)

echarts实现词云图表,及参数配置详解 最近,公司要实现一个关键词的统计显示,于是想起了词云图,记录一下,效果图如下所示。也可以直接去我的博客下载打包好的所有脚本和html。(https://download.csdn.net/download//85035375)1、在 中创建一个渲染图表的 ,引入脚本 2、js基本配置 配置详解:目前有两种方式(时间问题未尝试,亲们自己动手哈)(1) 可以在iconfont中下载(最好是填充的)图案,转为base64,就可以用来生成有图案的词云了。(2) 以上基本为 echarts-wordcloud 所 阅读详情

最近做的项目需要使用echarts的词云组件,但是在echarts2.0之后的echarts.js中已经不包涵词云属性,百度一番之后找到了一个支持彩色字体的js版本:echarts-wordcloud.js,只要引入这个js就可以使用了(注意:要在echarts.js之后引入)。

下载地址:点我下载

下载密码:fabw

解压后在 echarts-wordcloud-master/dist/ 目录下,原版和min版任选其一即可


下面附上词云的对应的option,将它set给echarts对象渲染即可使用

option = {
    title: {
        text: '词云',//标题
        x: 'center',
        textStyle: {
            fontSize: 23
        }

    },
    backgroundColor: '#F7F7F7',
    tooltip: {
        show: true
    },
    series: [{
        name: '热点分析',//数据提示窗标题
        type: 'wordCloud',
        sizeRange: [6, 66],//画布范围,如果设置太大会出现少词(溢出屏幕)
        rotationRange: [-45, 90],//数据翻转范围
        //shape: 'circle',
        textPadding: 0,
        autoSize: {
            enable: true,
            minSize: 6
        },
        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: [{
            name: "数据一",
            value: 1000
        }, {
            name: "数据二",
            value: 520
        }]//name和value建议用小写,大写有时会出现兼容问题
    }]
};

 

echart绘制词云图 wordcloud echart版本更新以后,不能直接识别series的type为wordcloud,从网上看到可以通过引入原min文件或js文件,但是没找到资源,于是后面看到另一种方法就是直接npm wordcloud包 步骤如下: 先下载 然后在使用的地方引入即可: ... 阅读详情

相关推荐

Python词云图进阶:从基础生成到形状蒙版与颜色定制

词云图是一种直观展示文本数据中关键词频率的可视化工具,通过字体大小差异突出核心词汇。其原理基于词频统计与布局算法,将高频词以更大字体显示在视觉中心。在数据分析、内容运营和品牌报告中,词云能快速提炼主题,提升信息传达效率。本文聚焦Python的wordcloud库,深入解析形状蒙版与颜色方案两大核心功能,帮助读者突破基础应用,实现定制化、高质量的词云生成,满足品牌调性与专业报告的美学需求。

weixin_34357887的博客 373

echarts使用echarts-wordcloud词云 字体颜色不生效问题解决

echarts使用echarts-wordcloud词云 自定义字体颜色不生效问题解决

阿星小栈 3350

CTransformers: 高效的Python语言模型绑定库

CTransformers是一个为C/C++实现的Transformer模型提供Python绑定的开源库。它基于GGML库构建,旨在为开发者提供一种高效且易用的方式来在Python中使用各种流行的语言模型。支持多种流行的语言模型,如GPT-2、LLaMA、Falcon等提供统一的简单API接口支持GPU加速(CUDA和Metal)与Hugging Face Transformers和LangChain集成支持流式输出和嵌入计算。

helloaiworld的博客 1269

Echarts—词云库(echarts-wordcloud)配置详解和使用(可自定义形状)

我们经常会看到一些网站或者页面有一堆五颜六色的词汇的聚在一块,有大有小的散落着,看着挺好看的;也许项目中也会涉及到显示一些关键词之类的需求,这个时候也可以用词云库(echarts-wordcloud)来实现;echarts-wordcloud是基于echarts的一个词云库,但是在echart官网中的配置相中却没有关于他的介绍,下面我们就来一起慢慢探索并能手到擒来的使用它;1.下载图片首先要找到一张图片,为了成功率较高,随意对图片也是有要求的,图片一定要是矢量图,并且最好为黑色填充,当然其他颜色也行。

前端探险家的博客 4万+

Cygwin安装教程

简介 cygwin是一个在windows平台上运行的unix模拟环境,是cygnus solutions公司开发的自由软件 Cygwin就是一个windows软件,该软件就是在windows上仿真linux操作系统 简言之,cygwin是一个在windows平台上运行的 linux模拟环境,使用一个Dll(动态链接库)来实现 这样,我们可以开发出Cygwin下的UNIX工具,使用这个DLL运行在W...

Errol's Blog 13万+

AI Agent在智能投研中的实战:多智能体信息整合与策略生成

那么,什么是AI Agent?简单来说,AI Agent是一种能够感知环境、做出决策并采取行动的自主系统。自主性:能够在没有人类直接干预的情况下运行,对自己的行为和内部状态有一定的控制权。反应性:能够感知环境的变化,并及时做出反应。主动性:不仅能够对环境变化做出反应,还能够主动地设定目标并采取行动实现这些目标。社会性:能够与其他Agent(包括人类和人工智能)进行交互、协作和竞争。它们可以全天候不间断地监控和处理海量信息,大大提升信息处理能力;

AI大模型应用之禅 193

echarts-wordcloud 血泪总结使用说明 (配置项及其不足点优化)

echarts-wordcloud的配置项说明,及权重问题优化

HurryUpp的博客 2万+

manimgl安装

安装manimgl

happytree001的博客 710

echarts 使用worldcloud并设置彩色字体

echarts 使用worldcloud并设置彩色字体 最近做的项目需要使用echarts的词云组件,但是在echarts2.0之后的echarts.js中已经不包涵词云属性,百度一番之后找到了一个支持彩色字体的js版本:echarts-wordcloud.js,只要引入这个js就可以使用了(注意:要在echarts.js之后引入)。 由于echarts3.0不支持彩色字体,在找了好久的情况下,终于找到一个worldcloud.js支持 点我下载 提取码: xdd8 直接导进去就OK了 ...

qq_48736958的博客 2607

Deepseek 10分钟化身理性荐股神器:触碰程序员不敢想的天花板

在这个消息疯狂、波动频繁的市场,“理性”两字显得弥足珍贵。通过Deepseek+AkShare+Aktools+Dify四位一体的方案,能帮我们降低信息搜集成本,并在短期投资领域搭建出一套“可解释、低门槛、易定制”的量化荐股流程。不要再盲目听小道消息或依赖情绪驱动,不妨给自己一个机会,让数据说话。而要注意的是,“理性荐股”并非万能,它只是工具,最终的收益还得依赖投资者自身对风险和机遇的权衡。祝大家都能在这股市里收获理性的底气,寻得更精准的入场时机。

qqxdh的博客 3755

中文核心:swin transformer 农作物病虫害识别 完整代码数据

中文核心:swin transformer 农作物病虫害识别

942

vue3 + echarts-wordcloud 绘制词云图表

首先要找到一张图片,为了成功率较高,一定要是。

阿乐的博客 2796

EPO: Hierarchical LLM Agents with Environment PreferenceOptimization

长期决策和规划任务依然是基于大型语言模型(LLM)的智能体面临的一大挑战(Valmeekam 等,2023;Liu 等,2023;Silver 等,2024)。这些任务需要智能体进行多步骤的规划,同时保持行为的一致性和目标导向,这对于通常被设计用于即时和局部预测的大型语言模型来说颇为困难。此外,针对具身智能体的大型语言模型微调面临的一个关键难题是大规模标注数据的需求(Reed 等,2022)。

qq_52053775的博客 143

echarts3.x,echarts5.x 的wordCloud兼容

echarts5.x 使用echarts-wordcloud2版本,参考官方Github https://github.com/ecomfe/echarts-wordcloud 且要注意写法,textStyle 设置随机色时,不用加normal,否则会出不了颜色 var chart = echarts.init(document.getElementById('main')); chart.setOption({ ... series: [{ type: 'wordClou

qq_33290233的博客 2485

ASProxy64.dll导致jetbrains家的IDE都无法打开。

摘要:在Windows11系统中,JetBrains IDE无法启动,报错指向ASProxy64.dll文件。该第三方DLL被注入到JVM原生层,导致内存访问冲突(错误代码0xc0000005)。经排查发现此文件来自Astrill软件。解决方案为卸载Astrill后重启电脑,问题得以解决。该案例表明第三方DLL注入可能影响IDE正常运行,卸载相关软件是最直接的解决方法。(149字)

猿小白的博客 940

NTscan扫描工具

ntscan是一个扫描器,可以扫描没有密码和弱密码的共享,先到配置文件中填写猜测的用户名和密码,扫描过程中右侧出现的是扫描日志。

vue3 + echarts-wordcloud(详细配置) 绘制词云图

词云图,是一种文本数据的视觉展示,由词汇组成类似云的彩色图形。echarts-wordcloud是基于echarts的一个词云库,本篇主要介绍它的使用方法。

qq_40912618的博客 1万+

WINCC7.3破解文件

WINCC7.3硬件够破解文件,有需要的下载!WINCC7.3硬件够破解文件,有需要的下载!

vue3 + echarts-wordcloud 绘制词云图

词云图,是一种文本数据的视觉展示,由词汇组成类似云的彩色图形。echarts-wordcloud是基于echarts的一个词云库,本篇主要介绍它的使用方法。

m0_70547044的博客 1310

迈瑞BS系列全自动生化分析仪LIS协议接口手册(内含HL7和ASTM)

迈瑞BS系列全自动生化分析仪LIS协议接口手册,内含HL7和ASTM)

echarts-wordcloud词云图使用(自定义词云形状:可以动态更改形状,每次进入渲染都可以更换自定义形状;emphasis属性自定义词条底色)

echarts-wordcloud词云图使用——自定义词云形状;emphasis属性textShadowColor的动态配置(鼠标悬浮词条的底色)

追逐知识的过程最能使我们意识到自己的无知... 4313

echarts 词云

由于echarts2以后的版本中都没有字符云,所以在使用的时候需要先把字符云组件引入 首先下载字符云 cnpm install echarts-wordcloud //添加字符云,前提要有echarts import 'echarts-wordcloud/dist/echarts-wordcloud' import 'echarts-wordcloud/dist/echarts-wordclou...

weixin_43856422的博客 2799

Echarts词云图字体颜色根据设置色系顺序展示

根据自定义设置色系的词云图,词云字体颜色根据你设置的色系数组顺序进行展示。

qq_38948398的博客 6357

echarts-wordcloud中配置项

echarts-wordcloud中配置项 series: [{ type: 'wordCloud', shape: 'circle', //圆形circle(默认),心形(heart,apple),菱形(diamond), //向前的三角形(triangle-forward) ,三角形(triangle),直立三角形(triangle-upright), 五边形(pentagon), 星型(star) //

rraxx的博客 2920

实现Echarts词云和随机颜色(vue2)

实现词云颜色处理

DAKADI 4251

Echarts词云图(echarts-wordcloud)使用详解,自定义图案

使用echarts搭配echarts-wordcloud库实现词云图,可自定义形状

ThreeKims的博客 1万+

echart扩展插件词云echarts-wordcloud

【代码】echart扩展插件词云echarts-wordcloud。

MISS_zhang_0110的博客 1614

【Echarts】使用echarts和echarts-wordcloud生成词云图

【Echarts】使用echarts和echarts-wordcloud生成词云图

qq_25285531的博客 3382
上一篇: OVER(PARTITION BY)函数的简单理解
下一篇: 使用Nginx代理后项目路径改变导致访问不到静态资源的解决方法
Javauthor
博客等级 码龄8年 11粉丝 12原创
评论 7
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值