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:单个节点的提示框样式设置,可以设置背景色、边框、字体等。
这些配置项可以帮助用户对旭日图的每个节点进行更加精细的设置和调整,以满足不同的可视化需求。