feat(visualMap): add seriesTargets option for multiple series-dimension mappings

src/component/visualMap/VisualMapModel.ts

@@ -33,9 +33,9 @@ import {
     OptionDataValue,
     BuiltinVisualProperty,
     DimensionIndex,
-    OptionId,
     ComponentOnCalendarOptionMixin,
-    ComponentOnMatrixOptionMixin
+    ComponentOnMatrixOptionMixin,
+    OptionId,
 } from '../../util/types';
 import ComponentModel from '../../model/Component';
 import Model from '../../model/Model';
@@ -93,6 +93,16 @@ export interface VisualMapOption<T extends VisualOptionBase = VisualOptionBase>
      */
     dimension?: number
 
+    /**
+     * Series targets with specific dimensions
+     * When provided, seriesIndex, seriesId, and dimension are ignored
+     */
+    seriesTargets?: {
+        seriesIndex?: number
+        seriesId?: OptionId
+        dimension: number
+    }[]
+
     /**
      * Visual configuration for the data in selection
      */
@@ -247,6 +257,30 @@ class VisualMapModel<Opts extends VisualMapOption = VisualMapOption> extends Com
      * @return An array of series indices.
      */
     protected getTargetSeriesIndices(): number[] {
+        const seriesTargets = this.option.seriesTargets;
+        if (seriesTargets) {
+            // When seriesTargets is provided, collect all target series indices
+            const indices: number[] = [];
+            each(seriesTargets, (target) => {
+                if (target.seriesIndex != null) {
+                    indices.push(target.seriesIndex);
+                }
+                else if (target.seriesId != null) {
+                    // Find series by ID
+                    let seriesModel: SeriesModel;
+                    this.ecModel.eachSeries(function (series) {
+                        if (series.id === target.seriesId) {
+                            seriesModel = series;
+                        }
+                    });
+                    if (seriesModel) {
+                        indices.push(seriesModel.componentIndex);
+                    }
+                }
+            });
+            return indices;
+        }
+
         const optionSeriesId = this.option.seriesId;
         let optionSeriesIndex = this.option.seriesIndex;
         if (optionSeriesIndex == null && optionSeriesId == null) {
@@ -406,8 +440,23 @@ class VisualMapModel<Opts extends VisualMapOption = VisualMapOption> extends Com
     //     }
     // }
 
+    getDimension(seriesIndex: number): number {
+        const seriesTargets = this.option.seriesTargets;
+        if (seriesTargets) {
+            const target = zrUtil.find(seriesTargets, target =>
+                (target.seriesIndex != null && target.seriesIndex === seriesIndex)
+                || (target.seriesId != null && target.seriesId === this.ecModel.getSeriesByIndex(seriesIndex).id)
+            );
+            if (target) {
+                return target.dimension;
+            }
+        }
+        return this.option.dimension;
+    }
+
     getDataDimensionIndex(data: SeriesData): DimensionIndex {
-        const optDim = this.option.dimension;
+        const seriesIndex = (data.hostModel as any).seriesIndex;
+        const optDim = this.getDimension(seriesIndex);
 
         if (optDim != null) {
             return data.getDimensionIndex(optDim);

src/component/visualMap/preprocessor.ts

@@ -53,6 +53,21 @@ export default function visualMapPreprocessor(option) {
                 }
             });
         }
+
+        // Validate seriesTargets
+        if (__DEV__) {
+            const seriesTargets = opt.seriesTargets;
+            if (seriesTargets && zrUtil.isArray(seriesTargets)) {
+                each(seriesTargets, function (target) {
+                    if (!zrUtil.isObject(target) || target.dimension == null) {
+                        console.warn('Each seriesTarget should have a dimension property');
+                    }
+                    if (target.seriesIndex == null && target.seriesId == null) {
+                        console.warn('Each seriesTarget should have either seriesIndex or seriesId');
+                    }
+                });
+            }
+        }
     });
 }