[Bug] svg rendering part of the area is displayed as black blocks

Version

5.3.3

Link to Minimal Reproduction

No response

Steps to Reproduce

`
echarts.registerMap('f1', {svg: svg}); var chartDom = document.getElementById('firstMapEcharts'); var myChart = echarts.init(chartDom, null, {renderer: 'svg'});

  var option = {
    geo: {
      map: 'f1',
      roam: false,
      left: "10px",
      top: "10px",
      right: "-450px",
      bottom: "20px",
      layoutSize: '100%',
      selectedMode: 'false',
      emphasis: {
        label: {
          show: false
        }
      }
    }
  };
  myChart.setOption(option);
  myChart.getOption();`

Current Behavior

Using echarts to display the svg map, the color of some areas in the figure is lost and displayed as black blocks

Expected Behavior

This is the original display of the svg image, use html to display this svg image, all colors are displayed normally

Environment

- OS:mac
- Browser:chrome
- Framework:"react": "^18.2.0",

Any additional comments?