图标小结

2022-06-16 11:50:48 浏览数 (2)

8、小结

各个图表的英文单词

ba

line

scatter/effectScatte

pie

map

rada

gauge

使用场景

柱状图:柱状图描述的是分类数据,呈现的是每一个分类中有多少

折线图:折线图常用来分析数据随时间的变化趋势

散点图:散点图可以帮助我们推断出不同维度数据之间的相关性

饼图:饼图可以很好地帮助用户快速了解不同分类的数据的占比情况

地图:地图主要可以帮助我们从宏观的角度快速看出不同地理位置上数据的差异

雷达图:雷达图可以用来分析多个维度的数据与标准数据的对比情况

仪表盘:仪表盘可以更直观的表现出某个指标的进度或实际情况

四、配置项小结

1、柱状图 ba

series[].type xAxis yAxis markPoint markLine label barWidth

图表类型 x轴 y轴 最大值最小 平均值 显示文 柱宽度

2、折线图 line

series[].type xAxis yAxis markPoint markLine label barWidth

图表类型 x轴 y轴 最大值最小 平均值 显示文 柱宽度

lineStyle areaStyle boundaryGap scale

线条风格 风格x轴 紧挨边缘 脱离0值比例

3、散点图 scatte

series[].type xAxis yAxis symbolSize

图表类型 x轴 y轴 散点大小

lineStyle showEffectOn rippleEffect scale

线条风格 显示时机 涟漪效果 脱离0值比例

4、饼图 pie

series[].type label radius roseType selectedMode selectedOffset

图表类型 显示文本 半径 饼图类型 是否多选 选中扇区偏移量

5、地图 map

series[].type geo map roam zoom

图表类型 地理坐标系组件 指明地图数据 开启鼠标拖动和缩放 平均值

center label geoIndex visualMap coordinateSystem

图表的中心 是否显示地区 指明关联的geo组 视觉映射组件 使用坐标系统

6、雷达图 rada

series[].type radar indicator label areaStyle shape

图表类型 雷达图组件 雷达图的指示器 文字 区域颜色 雷达图形状

7、仪表盘 gauge

series[].type max min itemStyle

图表类型 最大值 最小值 指针样式

8、直角坐标系配置

grid

show borderWidth borderColor left top right

是否可见 边框宽度 边框颜色 左边 顶部 右边

bottom width height

底部 宽度 高度

axis

type data position

底部轴类型 数据 显示位置

dataZoom

type xAxisIndex yAxisIndex start end

缩放块类型 x轴索引 y轴索引 初始值 结束值

9、通用配置

title

textStyle borderWidth borderColor borderRadius

文字样式 边框宽度 边框颜色 边框圆角

left top right bottom

左边 顶部 右边 底部

tooltip

trigger triggerOn formatte

触发类型 触发时机 内容自定义

toolbox.feature

saveAsImage dataView restore dataZoom magicType

缩放块类型 x轴索引 重置 缩放 图表转换

legend

data

图例数据, 需要和series数组中某组数据的name值一致

0 人点赞