apache / apache/echarts

[Bug] svg注册地图时,svg path 画扇形时,如果起点至终点为逆时针,则会鼠标交互无效

Open
#17,601 2 comments 0 reactions 0 assignees View on GitHub
bug SVG
Dominant language
TypeScript
Stars
67.3k
Forks
19.8k
Avg merge
11d 14h
Merged PRs (30d)
8

Description

### Version

5.3.3

### Link to Minimal Reproduction

_No response_

### Steps to Reproduce

const svgStr = ``
echarts.registerMap('mapName', { svg: svgStr});

const option = {
geo: {
map:'mapName',
// roam: this.canMouve, // 开启鼠标缩放和平移漫游
roam: 'move', // 开启鼠标缩放和平移漫游 move scale
// roam: true, // 开启鼠标缩放和平移漫游 move scale
selectedMode: false,
// selectedMode: 'single',
// selectedMode: 'multiple',
layoutCenter: ['50%', '50%'],
layoutSize: '100%', // 图的大小
scaleLimit: { min: 0.5, max: 10000 },
tooltip: {
show: true
},
itemStyle: {
// color: '#bfbfbf',
// borderColor: 'green',
// areaColor: 'pink'
// borderWidth: 1
},
label: {
show: true,
position: 'insideTopRight',
color: 'rgb(64, 158, 255)',
fontSize: 20,
formatter: (params) => {
if (params) {
return '*'
}
return `*`
}
},
emphasis: {
itemStyle: {
// color: 'red'
// borderColor: '#ffdf55',
// areaColor: '#ffdf55'
// borderWidth: 1
},
label: {
show: true,
position: 'insideTopRight',
color: 'rgb(64, 158, 255)',
fontSize: 20,
formatter: (params) => {
// console.log(params) // https://echarts.apache.org/zh/option.html#series-map.label.formatter
if (params) {
// return params.data.name
return '*'
}
return `*`
}
}
},

}

}

### Current Behavior

鼠标 放在 右侧半圆即 第二个path上无交互,放在左侧则有交互,但是将 两个path d属性的 a 属性,顺逆时针参数调整,即svg 变更为,
const svgStr = ``
echarts.registerMap('mapName', { svg: svgStr});

### Expected Behavior

预期,能正确解析svg 顺时针和逆时针,能顺利交互

### Environment

```markdown
- OS:macOS Monterey
- Browser:Chrome 104.0.5112.101
- Framework:vue@2
```

### Any additional comments?

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.