Zing图表-在地图上放置项目

Question

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

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

我找不到用于指定此属性的JSON属性（上面的链接仅指向网站主页）。请帮助我如何做到这一点，或向我指出任何文件。

[-EDIT-]我找到了一个函数，可以使用Lat/Lon值获取地图上的XY坐标，反之亦然（zingchart.maps.getXY（mapid，lonlat，itemid））。。但我仍然坚持在XY点上放置标记。

[-EDIT-]下面的答案如预期的那样有效。我正试着在美国地图上做记号。我想知道如何用lat/lon信息在阿拉斯加/夏威夷州放置标记，因为它们作为一个单独的多边形放置在加利福尼亚州下方，尽管它们在地理上位于美国上方。

Answer 1

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

在找到XY坐标之前，请等待地图加载，这一点至关重要。使用ZingChart"加载"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位置。

既然我们的变量中有Bangalore的XY坐标，我们就可以使用addobject API方法在该位置放置一个标记。下面，'zc'与用于放置图表的div的id相同。

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

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

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