wkup commented on issue #19414:
URL: https://github.com/apache/echarts/issues/19414#issuecomment-4582560829
### Same symptom under native ESM import maps (no bundler) — root cause + fix
Landed here with the exact symptom (empty `<canvas>`, but tooltips still
show on hover) using **ECharts 6.1.0** loaded through a browser **import map**
(Symfony AssetMapper) instead of a real bundler. The cause is specific to how
the ESM sub-bundles are served.
**Setup:** each entry point (`echarts`, `echarts/core`, `echarts/charts`,
`echarts/components`, `echarts/renderers`) and every `zrender/lib/*` module was
vendored as a **separate jsDelivr-bundled file** and wired individually in the
import map.
**Two failure modes**, both with the model populated (hence working
tooltips) but nothing painted on the canvas:
1. Tree-shaken — `import { use } from 'echarts/core'` + `use([LineChart,
GridComponent, CanvasRenderer, ...])` throws at `setOption`: Uncaught
TypeError: Cannot read properties of undefined (reading 'get') at cartesian2d
(charts-*.js) at getInitialData → init → setOption
2. Full import — `import * as echarts from 'echarts'` (the bundled
`index.js` that imports `zrender/lib/*` as bare specifiers): **no error at
all**, `chart.getOption().series.length === 1`, canvas is allocated at the
right size, but `getImageData()` reports **0 painted pixels**.
**Why:** when the sub-modules load as **distinct ESM module instances**,
ECharts' internal singleton registries — notably the coordinate-system registry
that `cartesian2d` reads via `CoordinateSystem.get(...)` — are **not shared**
across them. `GridComponent` registers `cartesian2d` into one copy of the
registry; `LineChart.getInitialData()` reads from another → `undefined`. In the
full-import variant the split happens on `zrender`, so the painter is wired
to a different instance and silently draws nothing.
**Fix:** serve a single self-contained bundle, so there is exactly one
module instance → one registry → one painter. The prebuilt full dist ESM
bundle inlines both `zrender` and `tslib` (no external/bare imports):
echarts/dist/echarts.esm.min.js // 6.1.0, ~1.1 MB
Symfony AssetMapper `importmap.php`:
```php
// before (broken): split entries — index.js pulls zrender/* as separate
modules
'echarts' => ['version' => '6.1.0'],
'echarts/core' => ['version' => '6.1.0'],
'echarts/charts' => ['version' => '6.1.0'],
'echarts/components' => ['version' => '6.1.0'],
'echarts/renderers' => ['version' => '6.1.0'],
'zrender/lib/...' => ['version' => '6.1.0'], // ~45 modules
// after (works): one self-contained file; app code keeps `import * as
echarts from 'echarts'`
'echarts' => ['path' => './assets/lib/echarts.esm.min.js'],
Charts render normally afterwards (non-blank canvas, no console error).
TL;DR for anyone on a no-bundler / import-map / SystemJS setup: if you
wire the per-module ESM files separately and get an empty canvas (tooltips
still work) or cartesian2d … reading 'get', switch to the single
dist/echarts.esm.min.js bundle so all internal registries live in one module
instance.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
