1

我正在尝试将位置标记放在类似于此页面中的美国地图上

http://www.zingchart.com/blog/2012/07/17/interactive-html5-maps-api/ （将项目放在地图部分。）

我找不到用于指定此内容的 JSON 属性（其上的链接仅指向该站点的主页）。请帮助我了解如何执行此操作或指向我的任何文档。

[--EDIT--] 我找到了一个使用纬度/经度值获取地图上 XY 坐标的函数，反之亦然 (zingchart.maps.getXY(mapid, lonlat, itemid)).. 但我仍然卡住了在那个 XY 点上放置一个标记。

[--EDIT--] 以下答案按预期工作。我正在尝试在美国地图上放置标记。我想知道如何在阿拉斯加/夏威夷州放置带有纬度/经度信息的标记，因为它们作为一个单独的多边形放置在加利福尼亚州下方，尽管它们在地理上位于美国之上。

4

1 回答 1

2

我是 ZingChart 团队的一员，我绝对可以帮助您解决这个问题！

请务必等到地图加载完毕后再找到 XY 坐标。使用 ZingChart 'load' API 事件监听器等待图表加载：

zingchart.load=function() {
    drawPoints();
};

在我们的 drawPoints 函数中，我们将找到经度和纬度值。如果值为北和东，则数字将为正，南和西将为负。例如，圣保罗位于 46.6333° W，23.5500° S，因此我们将使用 [-46.63, -23.55]。在这个地图演示中，我们在班加罗尔放置了一个标记，它位于 77.5667° E，12.9667° N，因此我们将使用 [77.57, 12.97]。

var lonlat = [77.57, 12.97];
var bangalore = zingchart.maps.getXY('map', lonlat);

getXY 方法返回一个长度为 2 的数组，索引 0 处的值是 x 位置，索引 1 处的值是地图的 y 位置。

现在我们的变量中有班加罗尔的 XY 坐标，我们可以使用addobject API 方法在该位置放置一个标记。下面，'zc' 与赋予用于放置图表的 div 的 id 相同。

zingchart.exec('zc', 'addobject', {
    type: 'shape',
    data: [{
        x: bangalore[0],
        y: bangalore[1],
        type: "circle",
        size: 3
    }]
});

要查看完整的代码，请查看提供的地图演示的页面源代码。

如果您还有任何问题，请告诉我！

于 2014-09-03T21:16:25.743 回答