apache / apache/echarts

[Bug] saveAsImage with pixelRatio > 1 renders 3D / echarts-gl components blank

Open
#21,700 2 comments 0 reactions 0 assignees View on GitHub
bug en gl pending regression
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

6.1.0

### Link to Minimal Reproduction

https://codepen.io/Danish-Munib/pen/raWzBYG

### Steps to Reproduce

1. Create a 3D chart using echarts-gl (e.g., line3D, surface, or bar3D).
2. Add the toolbox.feature.saveAsImage configuration.
3. Set pixelRatio in saveAsImage to a value greater than 1 (e.g., pixelRatio: 2).
4. Trigger saveAsImage via the toolbox button or programmatically using chart.getDataURL().

### Current Behavior

When pixelRatio is set to 1, the exported image renders correctly.

However, setting pixelRatio > 1 results in an exported image where the WebGL viewport/3D canvas content is entirely blank. Only 2d elements (such as the visualMap legend) are rendered.

Image
Image

### Expected Behavior

The exported image should render the complete 3D chart at high resolution corresponding to the specified pixelRatio.

### Environment

```markdown
- OS: Windows 10 Pro 22H2
- Browser: Brave 1.92.140 (Official Build)
- Framework: Vanilla JS
```

### Any additional comments?

The issue appears to stem from how WebGL framebuffers handle resizing during off-screen rendering when target pixel ratios are increased.

Contributor guide

Open the contributing guide

Research direction

Start with the linked CodePen reproduction and trace toolbox.feature.saveAsImage and chart.getDataURL when pixelRatio is greater than 1. Inspect the echarts-gl WebGL off-screen rendering and framebuffer resize path. Done means line3D, surface, and bar3D exports contain the 3D content at higher resolution while 2D elements remain correct.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
data-visualization, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.