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值一致