Echarts旭日图的配置项,强大的层级关系展示图表。

news2024/11/30 12:40:23

ECharts中的旭日图(Sunburst Chart)是一种数据可视化图表,用于展示层级关系数据。它通常用于呈现树状结构或层级结构的数据,例如组织结构、文件目录结构、地理区域层级等。


 


 

旭日图通过圆形的方式展示数据的层级结构,每个环形区域代表一个层级,而且每个区域的大小表示该层级的数据量。用户可以通过交互方式展开或收缩每个层级,以便更详细地查看数据。

旭日图的作用包括但不限于:

1. 展示层级结构:

通过图形化的方式清晰展示数据的层级结构,使用户更容易理解数据之间的关系。

2. 数据量比较:

通过区域大小的差异展示不同层级的数据量,帮助用户快速比较不同层级之间的数据情况。

3. 交互性:

用户可以通过交互方式展开或收缩不同层级,以便更详细地查看数据,提供更好的用户体验。


 


 

总之,旭日图是一种强大的数据可视化工具,可以帮助用户更好地理解和分析层级结构的数据。


配置项

ECharts中的旭日图(Sunburst Chart)有许多可配置的选项,以下是其中的一些:

1. series.type:必须设置为 "sunburst",表示使用旭日图类型的图表。

2. series.radius:旭日图的半径,可以是一个数组,表示内外半径,也可以是一个数字,表示内外半径相同。

3. series.data:图表的数据,必须是一个数组,每个元素代表一个节点,可以是一个对象或者一个数组。

4. series.highlightPolicy:高亮策略,表示鼠标悬停在节点上时的反应方式,可以是 "ancestor"(高亮祖先节点)、"descendant"(高亮子孙节点)或者 "self"(只高亮当前节点)。

5. series.label:标签的样式设置,可以设置字体大小、颜色、位置等。


 


 

6. series.itemStyle:节点的样式设置,可以设置颜色、边框、阴影等。

7. series.levels:层级的设置,可以设置不同层级的样式、标签、高亮策略等。

8. tooltip:提示框的样式设置,可以设置背景色、边框、字体等。

9. legend:图例的样式设置,可以设置位置、布局、字体等。

10. series.emphasis:高亮状态下的样式设置,可以设置节点的颜色、边框、标签等。


 


 

11. series.blur:非高亮状态下的样式设置,可以设置节点的颜色、边框、标签等。

12. series.nodeClick:节点被点击时的交互设置,可以设置节点被点击时的反应。

13. series.sort:节点的排序方式,可以设置为 "ascending"(升序)或 "descending"(降序)。

14. series.dataZoom:数据缩放的设置,可以设置缩放范围、缩放方式等。

15. series.animation:动画效果的设置,可以设置动画的持续时间、缓动效果等。


 


 

16. series.center:旭日图的中心位置,可以设置为坐标值或百分比。

17. series.rosetype:旭日图的展示方式,可以设置为 "radius"(半径展示)或 "area"(面积展示)。

18. series.highlightStyle:高亮状态下的样式设置,可以设置节点被高亮时的颜色、边框、阴影等。

19. series.data[].children:表示每个节点的子节点,可以是一个数组,用于表示多个子节点。

20. series.data[].name:节点的名称,用于显示在图表上。


 


 

21. series.data[].value:节点的值,用于决定节点的大小。

22. series.data[].itemStyle:单个节点的样式设置,可以设置颜色、边框、阴影等。

23. series.data[].label:单个节点的标签样式设置,可以设置字体大小、颜色、位置等。

24. series.data[].emphasis:单个节点高亮状态下的样式设置,可以设置颜色、边框、标签等。

25. series.data[].select:单个节点被选中时的样式设置,可以设置颜色、边框、标签等。

26. series.data[].tooltip:单个节点的提示框样式设置,可以设置背景色、边框、字体等。

这些配置项可以帮助用户对旭日图的每个节点进行更加精细的设置和调整,以满足不同的可视化需求。


 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1667769.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

AI技术构建本地知识库的流程

构建本地知识库是一个复杂的过程,涉及以下几个步骤,使用大模型技术构建本地知识库是一种很有前途的方法。随着大模型技术的不断发展,我们可以期待本地知识库将变得更加智能、高效和准确。北京木奇移动技术有限公司,专业的软件外包…

Cloudflare国内IP地址使用教程

Cloudflare国内IP地址使用教程 加速网站: 首先我们添加一个 A 记录解析,解析 IP 就是我们服务器真实 IP: 然后侧边栏 SSL/TLS - 自定义主机名: 回退源这里填写你刚刚解析的域名,保存后回退源状态为有效再来接下的操作…

2-1 EXTI外部中断(gd32)

中断的概念 中断硬件结构/软件结构 EXTI中断 EXTI硬件结构 注:EXTI线在同一时刻只能连接一个GPIO口,如果我们先连接了PA0,然后又连接了PB0那么此时PA0这个IO口就失去作用。 中断触发函数 中断优先级 中断优先级 数值越小优先级越高,抢占优先级…

17 M-LAG 配置思路

16 华三数据中心最流行的技术 M-LAG-CSDN博客 M-LAG 配置思路 什么是M-LAG?为什么需要M-LAG? - 华为 (huawei.com) 1 配置 M-LAG 的固定的MAC地址 [SW-MLAG]m-lag system-mac 2-2-2 2 配置M-LAG 的系统标识符系统范围1到2 [SW-MLAG]m-lag system-nu…

程序员工作中常见问题,你遇到过几个?

在赛博朋克2077玩后感中,我提到,即便是在严谨的机制下,依然可能出现让人匪夷所思或是贻笑大方的问题。 那么今天,就以后端程序员的视角,盘点下从设计开发到上线的常见问题,看看大家中过几个。 01 设计与开…

解决ubuntu无法上网问题

发现是网络配置成了Manual手动模式,现在都改成自动分配DHCP模式 打开后,尝试上网还是不行,ifconfig查看ip地址还是老地址,怀疑更改没生效,于是重启试试。 重启后,ip地址变了,可以打开网页了 …

中间件的使用

中间件是全局使用 工厂函数定义中间件 middleware.py # 工厂函数的中间件 def simple_middleware(get_response):def middleware(request):print("在视图函数处理之前执行、、、、、")response get_response(request)print("在视图函数处理之后执行。。。。…

宝塔面板Java项目部署,五步轻松搞定

当涉及到正规的开发项目时,最终的上线部署是至关重要的一个环节。本文旨在以最简单便捷的方法来教你如何完成项目的部署工作。 1. SSH下载地址 项目完成后需要使用SSH终端进行项目部署,以确保安全的远程访问、和操作远程服务器。 Xshell (支持Windows系…

【数据结构】排序(一)—— 希尔排序(思路演进版)

目录 一、常见的排序算法分类 二、常见排序算法的实现 2.1插入排序 2.1.1基本思想 2.1.2直接插入排序 思路 step1.单趟控制 step2.总体控制 代码实现 测试 特性总结 2.1.3 希尔排序( 缩小增量排序 ) 基本思想 思路演进 🌈1.代码实现单组排序&#…

【recast-navigation-js】通过websocket获取navmesh数据并初始化

目录 说在前面目录结构websocket服务器前端结果 说在前面 操作系统:windows 11浏览器:edge版本 124.0.2478.97recast-navigation-js版本:0.29.0golang版本:1.21.5 目录结构 D:. │ go.mod │ go.sum │ main.go // websocket …

Ant-design实现a-table无数据的时候展示中文

Ant-design实现国际化 1.基本需求 当a-table中没有数据的时候展示的是No Data现在我们需要将这个英文变成中文的形式 就要实现“国际化”2.实现国际化 参考:我用的是Vue3Ant-Design4.x 导入: import zhCN from "ant-design-vue/es/locale/zh_CN&qu…

Hadoop大数据应用技术复习题分析

文章目录 复习一一. 单选题二. 多选题三. 填空题 复习三一. 单选题 复习一 一. 单选题 (单选题)压缩速度由大到小snappy、LZO、gzip、bzip2,压缩比最大的是 A. snappy B. LZO C. gzip D. zip2 正确答案: D:zip2; 答案解析: 压缩率:zip2>…

深度学习--DCGAN

代码之后的注释和GAN的一样,大家如果已经掌握GAN,可以忽略掉哦!!! 在学习DCGAN之前,我们要先掌握GAN,深度学习--生成对抗网络GAN-CSDN博客 这篇博客讲的就是GAN的相关知识,还是很详…

8个免费无版权视频素材网站,高清无水印视频任性下载

在数字化时代,优质的视频素材成为各种项目不可缺少的元素,从短片制作到商业广告,高品质的视频能显著提高作品的吸引力和传播效果。然而,寻找既免费又无版权问题的高清视频素材并非易事。以下介绍几个优秀的免费视频素材网站&#…

ORA-609频繁出现在alert.log,如何解决?

ORA-609就alertlog中比较常见的一个报错,虽然并没有太大的影响,但是频繁的出现在alert log也是很让人厌烦的事情,本文介绍如何排查解决ORA-609问题。 1.ORA-609官方定义 could not attach to incoming connection Cause Oracle process cou…

通过linux花里胡哨的控制台,学习linux基础命令

今天这个B我装定了! 前言命令集 开始1、cowsay (让牛说话,够无聊的,但牛说的话是你输入的,细思极恐!)Debian/Ubuntu 安装命令:RHEL/CentOS/Fedora 安装:运行解释 2、fort…

libssh C++封装之七(File)

1 概述 libssh是一个在客户端和服务器端实现SSHv2协议的多平台C库。使用libssh,您可以远程执行程序、传输文件、使用安全透明的隧道、管理公钥等等。本文描述的对libssh客户端功能的C++封装。 libssh下载地址 3 实现 3.6 File File类型可以读写远程文件。 3.6.1 File定义 …

李宏毅-注意力机制详解

原视频链接:attention 一. 基本问题分析 1. 模型的input 无论是预测视频观看人数还是图像处理,输入都可以看作是一个向量,输出是一个数值或类别。然而,若输入是一系列向量,长度可能会不同,例如把句子里的…

Attention Sink

论文发现自回归LLM存在的一个有趣现象:对于输入文本最靠前的少量几个token,无论它们在语义上与语言建模任务的相关性如何,大量的注意力分数都会分配给他们,如下图所示: 模型的前两层还能保持attention score更多分配给…

第四步->手撕spring源码之bena注入实现和依赖

本步骤目标 上述几个步骤 定义和注册Bean (opens new window)、实例化Bean (opens new window),按照是否包含构造函数实现不同的实例化策略 (opens new window),那么在创建对象实例化这我们还缺少什么?其实还缺少一个关于类中是否有属性的问题…