带有标记的自定义SVG地图



我正试图在使用提供的在线工具生成的自定义svg地图上绘制地图标记(https://highcharts.github.io/map-from-svg/)。我正试图用纵横坐标在建筑物内部绘制标记。最终,我想创建一个类似于标记集群演示的东西(https://www.highcharts.com/demo/maps/marker-clusters)使用我的自定义SVG地图。

我的问题是:

  1. 是否可以通过lat/long在自定义SVG地图上绘制标记
  2. 如果是的话,我该怎么做呢?我是对地图的角落进行地理定位,以按纬度/经度绘制标记,还是将标记位置转换为地图上的x/y
  3. 如果我对自定义SVG地图进行地理定位,我该在对象中的何处添加这些数据
  4. 如果我在地图上将纬度/经度转换为x/y,我该如何处理

我已经使用在线工具将SVG转换为地图数据。我已经搜索了文档,但我并没有把如何做到这一点拼凑起来。

编辑:我应该提一下,我正在使用高角度图表(https://github.com/highcharts/highcharts-angular)

如果你想使用集群地图,应该准备一个对坐标系有参考的地图,生成的SVG地图是在没有这个的情况下绘制的。

本文描述了如何使用数据创建自己的地图,您需要将地图生成为GeoJSON/TopoJSON,然后才能引用lat/lon。

https://www.highcharts.com/docs/maps/custom-geojson-maps

在本例中,您可以看到如何在Angular中使用Highmaps加载SVG映射。

最新更新