[Bug] a second undefined canvas is drawn when drawing lines

[Kurioni]

Version

5.5.0

Link to Minimal Reproduction

https://echarts.apache.org/examples/en/editor.html?c=lines-bmap

Steps to Reproduce

1. Create several lines layers
2. In Chrome, go to developer mode and observe the canvas

Current Behavior

2 canvas are drawn in dom, one of them with id equal to undefined

Expected Behavior

If zlevel is not specified, then all layers are drawn on one canvas

Environment

- OS: Win 10
- Browser: Chrome 122.0.6261.112
- Framework: React

Any additional comments?

We encountered a similar bug in our project when we noticed that there was an extra canvas in the dom (we did not specify zlevel). The problem was solved by specifying zlevel, but in theory it should be 0 by default. A similar bug is also present in your examples (https://echarts.apache.org/examples/en/editor.html?c=lines-bmap), where we also noticed the same bug in one of them.

We noticed that when rendering a layer in zrender, the zlevel argument to the getLayer function may come with an undefined type.

[helgasoft]

using default world map instead of 3rd party bmap to make it simpler - Demo Code. When zlevel is not specified (default is 0 for both map and lines), there are two canvas elements:

• data-zr-dom-id="zr_0" for the map
• data-zr-dom-id="zr_undefined" for series "lines"

When only series has zlevel:1 the series canvas' id changes to data-zr-dom-id="zr_1". When both map & series have zlevel:1 there is only one canvas data-zr-dom-id="zr_1". You are expecting only one canvas with default zlevel:0.

This anomaly, I believe, only exists with maps. Technically it's not a bug since the official API does not elaborate on canvases or their number. Also it seems not a big coding challenge to find all canvases in the chart container and go from there.