我正在尝试使用KmlLayer将地标添加到地图中，但坐标未正确映射。我已经知道坐标是长的，纬度顺序，问题是坐标看起来像是比地图缩小了，但相对于彼此，它们似乎被正确放置，最终结果是所有的我的地标位于地图中间的一个群集中，而不是像它们应该的那样分布在整个地图上。我之前尝试过手动创建google.maps.Marker（）对象，当我这样做时坐标是正确的，所以我确定坐标是正确的。
我尝试设置一个JSFiddle进行演示，但我似乎无法让它工作，所以我只是link you to the live page.在该页面上，地图在完全缩小时受到了坐标（+/- 64，+ / - 64），因为使用这些边界使标记放置更容易，显然，我不关心正确映射到任何真实世界的坐标。作为参考，最西南的心脏标记被指定为坐标（-59.75，-56.75），因此它应该几乎位于地图的角落（在海湾最西南的船的甲板上，是精确）。当我使用这些精确坐标创建一个google.maps.Marker（）对象时，它正好位于我想要的位置。那么，任何人都可以帮我理解为什么KmlLayer坐标没有正确映射出来吗？
答案 0 :(得分：1)
KML使用WGS84经度和纬度坐标。您正在使用不使用这些坐标的custom map projection。
使用Maps API创建标记时，它会通过自定义投影，但我认为KML图层不会这样做。
据推测，这个KML文件是您自己在服务器上生成的，或者是某些脚本？然后，您可以在生成KML时根据需要投影坐标，以匹配Maps API代码中使用的投影。
如果这不方便或不可能，那么是否有必要使用KML图层？由于它可以使用Maps API Marker对象，因此可能只使用它运行。
在评论中跟进我们的对话，我认为最好的方法是使用JSON来存储标记数据。 JSON没有强加很多必需的结构;它有像JavaScript一样的对象和数组，你可以用任何对你有用的方式将它们组合在一起。以下是您的XML文件可能看起来像JSON的一个版本：
{
"groups": [
{
"type": "heartPiece",
"icon": "heartpiece.png",
"markers": [
{
"id": "p1",
"name": "Heart Piece #1",
"lat": -11.5,
"lng": 3.5
},
{
"id": "p2",
"name": "Heart Piece #2",
"lat": 5.75,
"lng": 58
},
{
"id": "p3",
"name": "Heart Piece #3",
"lat": 28.25,
"lng": 60.75
},
{
"id": "p4",
"name": "Heart Piece #4",
"lat": -58.75,
"lng": -16.25
},
{
"id": "p5",
"name": "Heart Piece #5",
"lat": -35,
"lng": -14
},
{
"id": "p6",
"name": "Heart Piece #6",
"lat": -11.25,
"lng": -30.25
},
{
"id": "p7",
"name": "Heart Piece #7",
"lat": -40,
"lng": -9.5
},
{
"id": "p8",
"name": "Heart Piece #8",
"lat": -5.75,
"lng": 9.75
},
{
"id": "p9",
"name": "Heart Piece #9",
"lat": -5,
"lng": 0.5
},
{
"id": "p10",
"name": "Heart Piece #10",
"lat": 2.75,
"lng": -10.25
},
{
"id": "p11",
"name": "Heart Piece #11",
"lat": 28.75,
"lng": 19.75
},
{
"id": "p12",
"name": "Heart Piece #12",
"lat": -54.75,
"lng": 45.75
},
{
"id": "p13",
"name": "Heart Piece #13",
"lat": -39.75,
"lng": 5.25
},
{
"id": "p14",
"name": "Heart Piece #14",
"lat": -56.75,
"lng": -59.75
},
{
"id": "p15",
"name": "Heart Piece #15",
"lat": -60.25,
"lng": 23
},
{
"id": "p16",
"name": "Heart Piece #16",
"lat": 64,
"lng": 0
},
{
"id": "p17",
"name": "Heart Piece #17",
"lat": -52.25,
"lng": 60.75
},
{
"id": "p18",
"name": "Heart Piece #18",
"lat": 48.25,
"lng": 31.25
},
{
"id": "p19",
"name": "Heart Piece #19",
"lat": 60.5,
"lng": 20.5
},
{
"id": "p20",
"name": "Heart Piece #20",
"lat": 22.75,
"lng": 24.5
},
{
"id": "p21",
"name": "Heart Piece #21",
"lat": 61.25,
"lng": 10.75
},
{
"id": "p22",
"name": "Heart Piece #22",
"lat": 40,
"lng": 56.5
},
{
"id": "p23",
"name": "Heart Piece #23",
"lat": -14.25,
"lng": 32.25
},
{
"id": "p24",
"name": "Heart Piece #24",
"lat": 29.75,
"lng": -61.25
},
{
"id": "p25",
"name": "Heart Piece #25",
"lat": 60.25,
"lng": -40.25
},
{
"id": "p26",
"name": "Heart Piece #26",
"lat": 63,
"lng": -44
},
{
"id": "p27",
"name": "Heart Piece #27",
"lat": 28.25,
"lng": -27.25
}
]
},
{
"type": "heartContainer",
"icon": "heartcontainer.png",
"markers": [
{
"id": "c1",
"name": "Heart Container #1",
"lat": -2.75,
"lng": 56
},
{
"id": "test",
"name": "Test",
"lat": -90,
"lng": -90
}
]
}
]
}
以下是一些未经测试的示例代码，用于加载JSON数据并创建标记：
$.getJSON( 'markers.json', function( json ) {
json.groups.forEach( function( group ) {
group.markers.forEach( function( mark ) {
mark.group = group;
addMarker( mark );
});
});
});
function addMarker( mark ) {
var marker = new google.maps.Marker({
map: map,
icon: '/images/icons/' + mark.group.icon,
position: new google.maps.LatLng( mark.lat, mark.lng ),
title: mark.name
});
}
此代码将转到您现在创建KML图层的位置。该代码使用jQuery的$.getJSON()来下载JSON文件。如果您不想为此使用jQuery，可以使用任意数量的等效函数，例如Maps API samples中的downloadUrl()函数。您可以像这样使用它：
downloadUrl( 'markers.json', function( data ) {
var json = JSON.parse( data );
json.groups.forEach(...
...
});
});
JSON数据的另一个选择是简单地将其转换为脚本。如果您获取该JSON文件并将loadMarkers(放在第一个{之前，并将)放在最后}之后，那么现在是JSON文件是一个可执行脚本，它调用全局loadMarkers()函数并将其传递给JSON数据。调用文件markers.js而不是markers.json，然后您可以使用上面链接的Maps API示例中非常简单的downloadScript()函数，如下所示：
loadMarkers = function( json ) {
json.groups.forEach(...
...
});
};
downloadScript( 'markers.js' );
这应该有助于你开始;如有疑问，请大声疾呼。