[Bug] 地图使用svg作为底图时, 怎样才能利用经纬度在地图中添加一个标点

[chenwwsdo]

Version

e.g. 5.3.2

Link to Minimal Reproduction

https://codepen.io/chenwwsdo/pen/JjeqYZg

Steps to Reproduce

series: [{ type: 'scatter', coordinateSystem: 'geo', data: [{ name: '标注点', value: [116, 100] }], symbolSize: 10, label: { show: false } }],

代码83到94行可以找到这段代码

Current Behavior

我在使用echarts.registerMap('mapName', mapJson)创建地图时, 是可以使用经纬度添加标点的, 但是了追求效果,我使用了echarts.registerMap('organ_diagram', { svg: svg })这种方式, 我发现经纬度生成点位并没有出现在正确的位置上, 所以我想知道有没有办法解决我的问题?

Expected Behavior

• 经纬度能转换成正确的坐标
• 可以直接识别经纬度坐标

Environment

- OS:
- Browser:
- Framework:

Any additional comments?

No response

[echarts-bot[bot]]

@chenwwsdo 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. 🤗

TRANSLATED

TITLE

[Bug] When the map uses svg as the base map, how to add a punctuation point to the map by using the latitude and longitude

BODY

Version

e.g. 5.3.2

Link to Minimal Reproduction

https://codepen.io/chenwwsdo/pen/JjeqYZg

Steps to Reproduce

series: [{ type: 'scatter', coordinateSystem: 'geo', data: [{ name: 'label point', value: [116, 100] }], symbolSize: 10, label: { show: false } }],

This code can be found on lines 83 to 94

Current Behavior

When I use echarts.registerMap('mapName', mapJson) to create a map, I can use latitude and longitude to add punctuation, but in order to pursue the effect, I use echarts.registerMap('organ_diagram', { svg: svg }) this way , I found that the latitude and longitude generated points did not appear in the correct position, so I wonder if there is a way to solve my problem?

Expected Behavior

• Latitude and longitude can be converted to correct coordinates
• Can directly identify latitude and longitude coordinates

Environment

- OS:
-Browser:
- Framework:

Any additional comments?

No response

[wayn3lee]

想知道解决了吗

[jzsn2018]

想知道解决了吗

[chj-damon]

请问你最后解决了吗？

[helgasoft]

It seems registerMap controls the type of map coordinates. geoJSON map will accept only lng/lat coordinates and SVG map will accept only x/y coordinates. I do not think a scatter point with latitude/longitude coordinates can be positioned on a SVG map. Would have been nice though...

[giserlk360]

It seems registerMap controls the type of map coordinates. geoJSON map will accept only lng/lat coordinates and SVG map will accept only x/y coordinates. I do not think a scatter point with latitude/longitude coordinates can be positioned on a SVG map. Would have been nice though...

I would like to know if it is not possible to directly use lng/lat coordinates to overlay point positions on an SVG map. Is there any way to convert lng/lat coordinates into x/y coordinates

[helgasoft]

Is there any way to convert lng/lat coordinates into x/y coordinates

Yes, provided that the geographic coordinate system used for drawing the SVG map is WGS 84. In my Demo I assume Iceland.svg is WGS 84 (turns out it's close, but not 100%). The only, but difficult, task is to find the lat/lng coordinates of the SVG bounding box - lower left and upper right corner points. Then convert all points' coordinates from (lat,lng) to (x,y) and display them.

[giserlk360]

Is there any way to convert lng/lat coordinates into x/y coordinates

Yes, provided that the geographic coordinate system used for drawing the SVG map is WGS 84. In my Demo I assume Iceland.svg is WGS 84 (turns out it's close, but not 100%). The only, but difficult, task is to find the lat/lng coordinates of the SVG bounding box - lower left and upper right corner points. Then convert all points' coordinates from (lat,lng) to (x,y) and display them.

Thank you very much for your reply.Do you have any good methods to find the lat/lng coordinates of the SVG bounding box？

[kkk-kppi]

Is there any way to convert lng/lat coordinates into x/y coordinates有没有办法将 lng/lat 坐标转换为 x/y 坐标

Yes, provided that the geographic coordinate system used for drawing the SVG map is WGS 84. In my Demo I assume Iceland.svg is WGS 84 (turns out it's close, but not 100%). The only, but difficult, task is to find the lat/lng coordinates of the SVG bounding box - lower left and upper right corner points. Then convert all points' coordinates from (lat,lng) to (x,y) and display them. 可以，前提是用于绘制 SVG 地图的地理坐标系为 WGS 84。在我的演示中，我假设Iceland.svg是 WGS 84（事实证明它很接近，但不是 100%）。唯一但困难的任务是找到 SVG 边界框的纬度/液度坐标 - 左下角和右上角点。然后将所有点的坐标从 （lat，lng） 转换为 （x，y） 并显示它们。

Thank you very much for your reply.Do you have any good methods to find the lat/lng coordinates of the SVG bounding box？非常感谢您的回复。你有什么好的方法来找到SVG边界框的lat/lng坐标吗？

Is there any way to convert lng/lat coordinates into x/y coordinates有没有办法将 lng/lat 坐标转换为 x/y 坐标

Yes, provided that the geographic coordinate system used for drawing the SVG map is WGS 84.可以，前提是用于绘制 SVG 地图的地理坐标系为 WGS 84。 In my Demo I assume Iceland.svg is WGS 84 (turns out it's close, but not 100%).在我的演示中，我假设Iceland.svg是 WGS 84（事实证明它很接近，但不是 100%）。 The only, but difficult, task is to find the lat/lng coordinates of the SVG bounding box - lower left and upper right corner points.唯一但困难的任务是找到 SVG 边界框的纬度/液度坐标 - 左下角和右上角点。 Then convert all points' coordinates from (lat,lng) to (x,y) and display them.然后将所有点的坐标从 （lat，lng） 转换为 （x，y） 并显示它们。

I want to know how to convert longitude and latitude into x, y of SVG; Looking forward to your reply