简介
由ECharts2 中的 dataRange 组件改名以及扩展而来
视觉元素类型：
- symbol: 图元的图形类别。
- symbolSize: 图元的大小。
- color: 图元的颜色。
- colorAlpha: 图元的颜色的透明度。
- opacity: 图元以及其附属物（如文字标签）的透明度。
- colorLightness: 颜色的明暗度。
- colorSaturation: 颜色的饱和度。
- colorHue: 颜色的色调。
visualMap映射方式
在 visualMap 组件所控制的 series 中，如果 series 中某个数据项需要避开 visualMap 映射
series: {
type: '...',
data: [
{name: 'Shanghai', value: 251},
{name: 'Haikou', value: 21},
// 设置 `visualMap: false` 则 visualMap 不对此项进行控制，此时系列
// 可使用自身的视觉参数（color/symbol/ ...控制此项的显示。
{name: 'Beijing', value: 821, visualMap: false},
...
]
}
type为continuous时，连续型------ 加粗部分有详细解释---斜体属于两种类型共有的属性
| 属性 | 类型 | 值 | 释义 |
|---|---|---|---|
| min/max | number | - | 指定 visualMapContinuous 组件的允许的最小/大值 |
| range | Array | - | 指定手柄对应数值的位置（在min-max范围内）不设置则默认[min, max] |
| calculable | boolean | - | 是否显示拖拽用的手柄 |
| realtime | boolean | - | 拖拽时，是否实时更新 |
| inverse | boolean | - | 是否反转 visualMap 组件 |
| precision | number | - | 数据展示的小数精度，默认0，无小数点，为1，一位小数... |
| itemWidth/itemHeight | number | - | 图形的宽/高度，即长条的宽/高度 |
| aligin | string | auto/left/top/right/bottom | 指定组件中手柄和文字的摆放位置 |
| text | Array | （顺序参照inverse两端文字主体之间的距离） | 两端的文本 |
| textGap | number | - | 两端文字主体之间的距离 |
| show | - | - | - |
| dimension | number | - | 指定用数据的『哪个维度』，映射到视觉元素上 |
| seriesIndex | number/Array | - | 指定取哪个系列的数据，即哪个系列的 series.data |
| hoverLink | bollean | - | 打开 hoverLink 功能时，鼠标悬浮到 visualMap 组件上时，鼠标位置对应的数值 在 图表中对应的图形元素，会高亮。反之，鼠标悬浮到图表中的图形元素上时，在 visualMap 组件的相应位置会有三角提示其所对应的数值 |
| inRange | - | - | 定义 在选中范围中 的视觉元素 |
| outOfRange | - | - | 定义 在选中范围外 的视觉元素 |
| controller | Object | inRange/outOfRange | visualMap 组件中，控制器 的 inRange outOfRange 设置。如果没有这个 controller 设置，控制器 会使用外层的 inRange outOfRange 设置 |
| z/zlevel | number | - | zlevel用于 Canvas 分层/z用于组件的所有图形的z值 |
| left/top/right/bottom | nunber/string（%） | - | visualMap 组件离容器左/上/右/下侧的距离 |
| orient | string | horizontal/vertical | 如何放置 visualMap 组件 |
| padding | - | - | 内边距，默认5 |
| backgroundColor/color | - | - | - |
| borderColor/borderWidth | - | - | - |
| textStyle | - | - | visualMap 文字样式 |
| formatter | - | - | 标签的格式化工具 |
| handle相关 | - | - | 手柄的样式配置 |
| indicator相关 | - | - | 指示器的形状，默认为圆形 |
关于inverse的详细解释
- inverse为false时，数据大小的位置规则，和直角坐标系相同
当 visualMap.orient 为'vertical'时，数据上大下小
当 visualMap.orient 为'horizontal'时，数据右大左小 - inverse为true时，相反
关于align
- auto：自动决定
- left：手柄和label在右，orient 为 horizontal 时有效
- right：手柄和label在左，orient 为 horizontal 时有效
- top：手柄和label在下，orient 为 vertical 时有效
- bottom：手柄和label在上，orient 为 vertical 时有效
关于dimension
数据就是 series.data。 可以把 series.data 理解成一个二维数组。例：
[
[12, 23, 43],
[12, 23, 43],
[43, 545, 65],
[92, 23, 33]
]
其中每个列是一个维度，即 dimension。 例如 dimension 为 1 时，取第二列（即 23，23，545，23），映射到视觉元素上。
默认取 data 中最后一个维度
关于inRange和outOfRange
关于可用的视觉元素在文章开头已经提出来了
handle相关与indicator指示器相关
handle相关
指示器相关，形状大小样式
指示器形状
被控制的组件
type为piecewise时，分段型------ 加粗部分有详细解释
| 属性 | 类型 | 值 | 释义 |
|---|---|---|---|
| splitNumber | number | - | 对于连续型数据，自动平均切分成几段 |
| pieces | Array | - | 自定义每一段的范围 |
| categories | Array | - | 用于表示离散型数据（或可以称为类别型数据、枚举型数据）的全集 |
| minOpen/maxOpen | boolean | - | 当 type 为 piecewise 且使用 min/max/splitNumber 时，此参数有效,当值为 true 时，界面上会额外多出一个"min"的选块 |
| selectedMode | - | multiple/single | 选择模式 |
| itemGap | - | - | 每两个图元之间的间隔距离 |
| itemSymbol | - | - | 默认的图形 |
| showLabel | boolean | - | 是否显示每项的文本标签 |
minOpen/maxOpen为true时
itemSymbol
showLabel
