echarts icon indicating copy to clipboard operation
echarts copied to clipboard

Fix: Respect encode.value in visualMap for multi-column datasets

Open Adityakashyap1011 opened this issue 2 months ago • 2 comments

Brief Information

This pull request is in the type of:

  • [x] bug fixing
  • [ ] new feature
  • [ ] others

What does this PR do?

Fixes visualMap to respect the series encode.value configuration when determining which dimension to use for visual mapping.

Fixed issues

  • Resolves issue where heatmap with multiple value columns ignores encode.value and uses the last column instead

Details

Before: What was the problem?

When a series (e.g., heatmap with matrix coordinate system) has multiple value columns in the dataset and uses encode to specify which dimension should be mapped as 'value', the visualMap component was ignoring this configuration. Instead, it used a backward search algorithm that always picked the last non-coordinate dimension.

Example:

dataset: { source: [ ['x', 'y', 'value1', 'value2', 'value3'], ['A', 'X', 0.1, 0.5, 0.9], ['A', 'Y', 0.2, 0.6, 0.8], ['B', 'X', 0.3, 0.7, 0.7], ['B', 'Y', 0.4, 0.8, 0.6] ] }, series: [{ type: 'heatmap', coordinateSystem: 'matrix', encode: { x: 'x', y: 'y', value: 'value1' } }]

The visualMap would incorrectly use 'value3' (last column) instead of 'value1' for color mapping, producing an inverted gradient.

After: How does it behave after the fixing?

Modified getDataDimensionIndex() in src/component/visualMap/VisualMapModel.ts to:

  1. First check for explicit dimension option (existing behavior)
  2. Respect the series encode configuration by using data.mapDimension('value')
  3. Fall back to backward search only if no encoded 'value' dimension exists

Now when encode: { value: 'value1' } is specified, the visualMap correctly uses 'value1' for color mapping, producing the expected visual gradient.

Document Info

One of the following should be checked.

  • [x] This PR doesn't relate to document changes
  • [ ] The document should be updated later
  • [ ] The document changes have been made in apache/echarts-doc#xxx

Misc

Security Checking

  • [ ] This PR uses security-sensitive Web APIs.

ZRender Changes

  • [ ] This PR depends on ZRender changes (ecomfe/zrender#xxx).

Related test cases or examples to use the new APIs

Test file: test/heatmap-encode-value-fix.html demonstrates the fix with a heatmap using matrix coordinate system and multiple value columns.

Merging options

  • [x] Please squash the commits into a single one when merging.

Other information

Files modified:

  • src/component/visualMap/VisualMapModel.ts - Modified getDataDimensionIndex() to respect encode configuration
  • test/heatmap-encode-value-fix.html - Added test/verification file

Adityakashyap1011 avatar Dec 03 '25 12:12 Adityakashyap1011

Thanks for your contribution! The community will review it ASAP. In the meanwhile, please checkout the coding standard and Wiki about How to make a pull request.

Please DO NOT commit the files in dist, i18n, and ssr/client/dist folders in a non-release pull request. These folders are for release use only.

echarts-bot[bot] avatar Dec 03 '25 12:12 echarts-bot[bot]

Thanks for the PR! This use case can be solved with the existing visualMap.dimension config.

A few concerns:

  1. Increases coupling between visualMap and series

    • visualMap is designed as an independent component that specifies the target dimension via dimension option
    • This change makes visualMap implicitly depend on series encode config
  2. encode.value is not a general encode

    • value is used only by specific charts (pie, funnel, heatmap, map)
    • Line/bar charts use encode.x/y, they don't have encode.value

Justin-ZS avatar Dec 09 '25 03:12 Justin-ZS