diff --git a/en/option/component/axis-common.md b/en/option/component/axis-common.md index 85c6cc005..f0ccf9de0 100644 --- a/en/option/component/axis-common.md +++ b/en/option/component/axis-common.md @@ -932,6 +932,66 @@ max: function (value) { `value` is an object, containing the `min` value and `max` value of the data. This function should return the max value of axis, or return `null`/`undefined` to make echarts use the auto calculated max value (`null`/`undefined` return is only supported since `v4.8.0`). +#${prefix} dataMin(number) + + + +{{ use: partial-version( + version = '6.1.0' +) }} + +Specify the data minimum value to extend the axis range while preserving the nice scale algorithm. + +It is available only for value, logarithmic, and time axes, i.e., [type](~${componentType}.type): 'value', 'log', or 'time'. + +**How it works:** + +`dataMin` works like inserting a virtual data point into your dataset, but this point only participates in axis range calculation and won't be displayed in the chart. + +- When `dataMin` is **less than** the actual data minimum: The axis extends to include this value, using a nice scale value no greater than `dataMin` as the axis minimum +- When `dataMin` is **greater than or equal to** the actual data minimum: No effect, the axis is calculated using the original logic + +**Use cases:** + +- Ensure the axis includes a reference value (like passing line, target value, etc.) +- Reserve visual space for data + +**The difference from [min](~${componentType}.min):** +- `min` fixes the axis minimum value and disables the nice scale algorithm +- `dataMin` only affects the axis range while preserving the nice scale algorithm + + + +#${prefix} dataMax(number) + + + +{{ use: partial-version( + version = '6.1.0' +) }} + +Specify the data maximum value to extend the axis range while preserving the nice scale algorithm. + +It is available only for value, logarithmic, and time axes, i.e., [type](~${componentType}.type): 'value', 'log', or 'time'. + +**How it works:** + +`dataMax` works like inserting a virtual data point into your dataset, but this point only participates in axis range calculation and won't be displayed in the chart. + +- When `dataMax` is **greater than** the actual data maximum: The axis extends to include this value, using a nice scale value no less than `dataMax` as the axis maximum +- When `dataMax` is **less than or equal to** the actual data maximum: No effect, the axis is calculated using the original logic + +**Use cases:** + +- Ensure the Y-axis includes a target value or ceiling +- Reserve visual space above the data for better presentation +- Maintain consistent axis ranges across multiple charts + +**The difference from [max](~${componentType}.max):** +- `max` fixes the axis maximum value and disables the nice scale algorithm +- `dataMax` only affects the axis range while preserving the nice scale algorithm + + #${prefix} scale(boolean) = false diff --git a/en/option/component/radar.md b/en/option/component/radar.md index 5fd2b5fd0..94d824c5d 100644 --- a/en/option/component/radar.md +++ b/en/option/component/radar.md @@ -29,6 +29,14 @@ Here is a custom example of radar component. none = true ) }} +## clockwise(boolean) = false + +{{ use: partial-version(version = "6.1.0") }} + + + +Whether to clockwise layout indicator axis. + ## startAngle(number) = 90 The start angle of coordinate, which is the angle of the first indicator axis. diff --git a/en/option/component/visual-map.md b/en/option/component/visual-map.md index e23be60a6..9843884d3 100644 --- a/en/option/component/visual-map.md +++ b/en/option/component/visual-map.md @@ -325,6 +325,55 @@ Specify visual mapping should be performed on which series, from which Can be a id or a list of ids. All series are used by default. +## seriesTargets(Array) + +{{ use: partial-version(version = "6.1.0") }} + +Specify multiple series with their corresponding dimension mappings. When `seriesTargets` is configured, `seriesIndex`, `seriesId`, and `dimension` will be ignored. + +This option allows a single `visualMap` component to control different dimensions of multiple series simultaneously, which is particularly useful when working with datasets. + +Each target object should contain the following properties: +- `seriesIndex` or `seriesId`: Specify the series (choose one) +- `dimension`: Specify the data dimension for that series + +Example: +```javascript +option = { + dataset: { + source: [ + ['product', 'sales', 'price', 'year'], + ['A', 100, 20, 2020], + ['B', 200, 30, 2021], + ['C', 150, 25, 2022] + ] + }, + visualMap: { + type: 'continuous', + min: 0, + max: 100, + // Configure different series to use different dimensions + seriesTargets: [ + { + seriesIndex: 0, + dimension: 1 // First series uses 'sales' dimension + }, + { + seriesIndex: 1, + dimension: 2 // Second series uses 'price' dimension + } + ], + inRange: { + color: ['#50a3ba', '#eac736', '#d94e5d'] + } + }, + series: [ + { type: 'bar' }, + { type: 'line' } + ] +}; +``` + ## hoverLink(boolean) = true `hoverLink` enable highlight certain graphical elements of chart when mouse hovers on some place of `visualMap` component that is corresponding to those graphical elements by visual mapping. diff --git a/en/option/series/pie.md b/en/option/series/pie.md index 0e7d67784..a678a552c 100644 --- a/en/option/series/pie.md +++ b/en/option/series/pie.md @@ -531,6 +531,7 @@ Label rotation. + If `true` or `'radial'`, the labels are rotated radially. (The `'radial'` literal is supported since `v5.2.0`) + If `'tangential'`, the labels are rotated tangentially. (Since `v5.2.0`) ++ If `'tangential-noflip'`, the arrangement will be tangential and will not flip. (Since `v6.1.0`) + If `number`, the labels are rotated in degrees (-90° - 90°). The negative value represents clockwise. {{ use: partial-text-style( diff --git a/en/tutorial/visual-map.md b/en/tutorial/visual-map.md index 87412594b..8237a26cd 100644 --- a/en/tutorial/visual-map.md +++ b/en/tutorial/visual-map.md @@ -145,4 +145,46 @@ option = { }; ``` +Example C (Using `seriesTargets` to map different dimensions for different series): + +```javascript +option = { + dataset: { + source: [ + ['product', 'sales', 'price', 'year'], + ['A', 100, 20, 2020], + ['B', 200, 30, 2021], + ['C', 150, 25, 2022] + ] + }, + visualMap: [ + { + type: 'continuous', + min: 0, + max: 100, + // seriesTargets allows specifying different mapping dimensions for different series + // When seriesTargets is configured, dimension, seriesIndex, and seriesId are ignored + seriesTargets: [ + { + seriesIndex: 0, + dimension: 1 // First series maps to 'sales' dimension + }, + { + seriesIndex: 1, + dimension: 2 // Second series maps to 'price' dimension + } + ], + inRange: { + color: ['#50a3ba', '#eac736', '#d94e5d'] + } + }, + ... + ], + series: [ + { type: 'bar' }, + { type: 'line' } + ] +}; +``` + For more information, please refer to [visualMap.inRange](option.html#visualMap.inRange) and [visualMap.outOfRange](option.html#visualMap.outOfRange). diff --git a/zh/option/component/axis-common.md b/zh/option/component/axis-common.md index e60d3cdc8..2a9d53d77 100644 --- a/zh/option/component/axis-common.md +++ b/zh/option/component/axis-common.md @@ -929,6 +929,64 @@ max: function (value) { 其中 `value` 是一个包含 `min` 和 `max` 的对象,分别表示数据的最大最小值,这个函数可返回坐标轴的最大值,也可返回 `null`/`undefined` 来表示“自动计算最大值”(返回 `null`/`undefined` 从 `v4.8.0` 开始支持)。 +#${prefix} dataMin(number) + + + +{{ use: partial-version( + version = '6.1.0' +) }} + +指定数据最小值,用于扩展坐标轴范围同时保持自动刻度优化。 + +只在数值轴、对数轴、时间轴中([type](~${componentType}.type): 'value'、'log' 或 'time')有效。 + +**工作原理:** + +`dataMin` 的效果好似在数据中插入了一个虚拟的数据点,但这个点只参与坐标轴范围的计算,不会实际显示在图表中。 + +- 当 `dataMin` **小于**实际数据最小值时:坐标轴会扩展以包含这个值,使用一个不大于 `dataMin` 的整齐刻度值作为坐标轴最小值 +- 当 `dataMin` **大于等于**实际数据最小值时:不产生任何影响,按原有逻辑计算 + +**适用场景:** + +- 确保坐标轴包含某个参考值(如及格线、目标值等) +- 需要为数据留出一定的视觉空间 + +**与 [min](~${componentType}.min) 的区别:** +- `min` 会固定坐标轴最小值,禁用自动刻度优化 +- `dataMin` 只影响坐标轴范围,仍保持自动刻度优化 + +#${prefix} dataMax(number) + + + +{{ use: partial-version( + version = '6.1.0' +) }} + +指定数据最大值,用于扩展坐标轴范围同时保持自动刻度优化。 + +只在数值轴、对数轴、时间轴中([type](~${componentType}.type): 'value'、'log' 或 'time')有效。 + +**工作原理:** + +`dataMax` 的效果好似在数据中插入了一个虚拟的数据点,但这个点只参与坐标轴范围的计算,不会实际显示在图表中。 + +- 当 `dataMax` **大于**实际数据最大值时:坐标轴会扩展以包含这个值,使用一个不小于 `dataMax` 的整齐刻度值作为坐标轴最大值 +- 当 `dataMax` **小于等于**实际数据最大值时:不产生任何影响,按原有逻辑计算 + +**适用场景:** + +- 确保坐标轴包含目标值或上限值 +- 为数据预留视觉空间,使图表更美观 +- 使多个相似的图表保持一致的坐标轴范围 + +**与 [max](~${componentType}.max) 的区别:** +- `max` 会固定坐标轴最大值,禁用自动刻度优化 +- `dataMax` 只影响坐标轴范围,仍保持自动刻度优化 + + #${prefix} scale(boolean) = false diff --git a/zh/option/component/radar.md b/zh/option/component/radar.md index 842973699..7d10986b7 100644 --- a/zh/option/component/radar.md +++ b/zh/option/component/radar.md @@ -65,6 +65,14 @@ const option = { none = true ) }} +## clockwise(boolean) = false + +{{ use: partial-version(version = "6.1.0") }} + + + +是否以顺时针排布指示器轴。 + ## startAngle(number) = 90 坐标系起始角度,也就是第一个指示器轴的角度。 diff --git a/zh/option/component/visual-map.md b/zh/option/component/visual-map.md index 249bdf8e1..f86d40d5c 100644 --- a/zh/option/component/visual-map.md +++ b/zh/option/component/visual-map.md @@ -295,6 +295,55 @@ chart.setOption(option); // option设置回 ${componentMainType} 可以是一个 id 或者一个 id 数组。 默认取所有系列。 +## seriesTargets(Array) + +{{ use: partial-version(version = "6.1.0") }} + +指定多个系列及其对应的维度映射关系。当配置了 `seriesTargets` 时,`seriesIndex`、`seriesId` 和 `dimension` 将被忽略。 + +这个选项允许单个 `visualMap` 组件同时控制多个系列的不同维度,特别适用于使用 dataset 的场景。 + +每个目标对象应包含以下属性: +- `seriesIndex` 或 `seriesId`:指定系列(二者选其一) +- `dimension`:指定该系列使用的数据维度 + +示例: +```javascript +option = { + dataset: { + source: [ + ['product', 'sales', 'price', 'year'], + ['A', 100, 20, 2020], + ['B', 200, 30, 2021], + ['C', 150, 25, 2022] + ] + }, + visualMap: { + type: 'continuous', + min: 0, + max: 100, + // 配置不同系列使用不同维度 + seriesTargets: [ + { + seriesIndex: 0, + dimension: 1 // 第一个系列使用 'sales' 维度 + }, + { + seriesIndex: 1, + dimension: 2 // 第二个系列使用 'price' 维度 + } + ], + inRange: { + color: ['#50a3ba', '#eac736', '#d94e5d'] + } + }, + series: [ + { type: 'bar' }, + { type: 'line' } + ] +}; +``` + ## hoverLink(boolean) = true 打开 `hoverLink` 功能时,鼠标悬浮到 `visualMap` 组件上时,鼠标位置对应的数值 在 图表中对应的图形元素,会高亮。 diff --git a/zh/option/series/pie.md b/zh/option/series/pie.md index d92c3a64d..73714af15 100644 --- a/zh/option/series/pie.md +++ b/zh/option/series/pie.md @@ -547,6 +547,7 @@ const option = { + 如果为 `true` 或 `'radial'`,则为径向排布。(`'radial'` 字面量从 `v5.2.0` 开始支持) + 如果为 `'tangential'`,则为切向排布。(从 `v5.2.0` 开始支持) ++ 如果为 `'tangential-noflip'`,则为切向排布,不反转。(从 `v6.1.0` 开始支持) + 如果为 `number` ,旋转指定角度,从 -90 度到 90 度。正值是逆时针。 diff --git a/zh/tutorial/visual-map.md b/zh/tutorial/visual-map.md index cee605411..75db46e04 100644 --- a/zh/tutorial/visual-map.md +++ b/zh/tutorial/visual-map.md @@ -146,4 +146,45 @@ option = { }; ``` +例三(使用 `seriesTargets` 映射不同系列的不同维度): +```javascript +option = { + dataset: { + source: [ + ['product', 'sales', 'price', 'year'], + ['A', 100, 20, 2020], + ['B', 200, 30, 2021], + ['C', 150, 25, 2022] + ] + }, + visualMap: [ + { + type: 'continuous', + min: 0, + max: 100, + // 使用 seriesTargets 可以为不同系列指定不同的映射维度 + // 当配置 seriesTargets 后,dimension、seriesIndex、seriesId 将被忽略 + seriesTargets: [ + { + seriesIndex: 0, + dimension: 1 // 第一个系列映射 'sales' 维度 + }, + { + seriesIndex: 1, + dimension: 2 // 第二个系列映射 'price' 维度 + } + ], + inRange: { + color: ['#50a3ba', '#eac736', '#d94e5d'] + } + }, + ... + ], + series: [ + { type: 'bar' }, + { type: 'line' } + ] +}; +``` + 更多详情,参见 [visualMap.inRange](option.html#visualMap.inRange) 和 [visualMap.outOfRange](option.html#visualMap.outOfRange)。