echarts-bot[bot] commented on issue #17601: URL: https://github.com/apache/echarts/issues/17601#issuecomment-1232646318
@cieme It seems you are not using English, I've helped translate the content automatically. To make your issue understood by more people and get helped, we'd like to suggest using English next time. 🤗 <details><summary><b>TRANSLATED</b></summary><br> **TITLE** [Bug] When the svg register map, when the svg path draws a fan shape, if the start point to the end point is counterclockwise, the mouse interaction will be invalid **BODY** ### Version 5.3.3 ### Link to Minimal Reproduction _No response_ ### Steps to Reproduce const svgStr = `<svg viewBox="0 0 1024 768" version="1.1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org /1999/xlink" stroke-linecap="round" stroke-linejoin="round" fill-rule="evenodd" xml:space="preserve"> <path d="M300.707,39.0422 A40.7058,40.7058 0 0,0 300.707,120.454 " name="uuid"></path><path d="M300.707,120.454 A40.7058,40.7058 0 0,0 300.707,39.0422 " name="uuid"></path></ svg>` echarts.registerMap('mapName', { svg: svgStr}); const option = { geo: { map:'mapName', // roam: this.canMouve, // enable mouse zoom and pan roam roam: 'move', // enable mouse zoom and pan roam move scale // roam: true, // enable mouse zoom and pan roam move scale selectedMode: false, // selectedMode: 'single', // selectedMode: 'multiple', layoutCenter: ['50%', '50%'], layoutSize: '100%', // the size of the image 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/en/option.html#series-map.label.formatter if (params) { // return params.data.name return '*' } return `*` } } }, } } ### Current Behavior The mouse is placed on the right semicircle, that is, there is no interaction on the second path, and there is interaction on the left, but the a attribute of the two path d attributes is adjusted clockwise and counterclockwise, that is, the svg is changed to, const svgStr = `<svg viewBox="0 0 1024 768" version="1.1" xmlns="http://www.w3.org/2000/svg"; xmlns:xlink="http://www.w3.org /1999/xlink" stroke-linecap="round" stroke-linejoin="round" fill-rule="evenodd" xml:space="preserve"> <path d="M300.707,39.0422 A40.7058,40.7058 0 0,1 300.707,120.454 " name="uuid"></path><path d="M300.707,120.454 A40.7058,40.7058 0 0,1 300.707,39.0422 " name="uuid"></path></ svg>` echarts.registerMap('mapName', { svg: svgStr}); ### Expected Behavior Expected, can correctly parse svg clockwise and counterclockwise, can interact smoothly ### Environment ````markdown - OS: macOS Monterey - Browser: Chrome 104.0.5112.101 - Framework:vue@2 ```` ### Any additional comments? _No response_ </details> -- 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]
