将 SVG 圆坐标转换为传单地理坐标系

Question

我正在开发一个概念验证应用程序，该应用程序显示布鲁塞尔地铁的实时地图 (see it)。我使用 Adob​​e Illustrator 创建了地图，并使用 circle 来表示每个站点。对于地图视图，我使用的是leafletjs。

例如，这是带有圆圈的 svg 地图的简化版本。

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 5457 4961">
<defs><style>.a{fill:#fff;stroke:#000;stroke-miterlimit:10;}</style></defs>
<title>Simple Map</title>
<circle class="a" cx="1957.5" cy="1399.5" r="4.5"/></svg>

这是我的leafletjs地图的定义

var map = L.map('map', {
            crs: L.CRS.Simple,
            zoomDelta: 0.50,
            zoomSnap: 0,
            minZoom: -1,
            maxZoom: 1.5 ,
            touchZoom: true,
            fullscreenControl: true,
});

var bounds = [[0,0], [1000,1000]];
var image = L.imageOverlay('./images/map.svg', bounds).addTo(map);

我的问题是：

是否可以将svg圆的cx和cy转换为传单地理坐标系统？

我需要在所有有地铁的站点上放置一个传单标记。现在，对于我地图上显示的唯一一条线，我手动获得了坐标:(

提前致谢！ 温贝托

Answer 1

你可以用它来移动你的圈子 其中x和y分别是x轴和y轴坐标

$('rect').attr("transform","translate("+x+","+y+")");