问题描述
我手工创建了这个.kml文件,概述了美国新罕布什尔州的一个地区。它可以很好地在Google mymaps中加载,但是如果我将其加载到Google Earth中,则显然会放置在“空岛”(纬度0,经度0)上。该文件怎么了?
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0"> <Document>
<Placemark>
<Linestring>
<coordinates>
-71.21122,43.25277,0.
-71.20669,43.24993,0.
-71.20720,43.24918,0.
-71.20512,43.24787,0.
-71.20566,43.24733,0.
-71.20576,43.24718,43.24557,0.
-71.20763,43.24572,0.
-71.20746,43.24666,0.
-71.20855,43.24638,0.
-71.20868,43.24588,0.
-71.20961,43.24596,0.
-71.21044,43.24290,0.
-71.21673,43.24390,0.
-71.21122,0.
</coordinates>
</Linestring>
</Placemark>
</Document> </kml>
谢谢
解决方法
KML coordinates are longitude,latitude;不允许有空格。
您的KML应该是:
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0"> <Document>
<Placemark>
<LineString>
<coordinates>
-71.21122,43.25277,0.
-71.20669,43.24993,0.
-71.20720,43.24918,0.
-71.20512,43.24787,0.
-71.20566,43.24733,0.
-71.20576,43.24718,43.24557,0.
-71.20763,43.24572,0.
-71.20746,43.24666,0.
-71.20855,43.24638,0.
-71.20868,43.24588,0.
-71.20961,43.24596,0.
-71.21044,43.24290,0.
-71.21673,43.24390,0.
-71.21122,0.
</coordinates>
</LineString>
</Placemark>
</Document> </kml>
example displaying with the Google Maps Javascript API v3
代码段:
function initMap() {
const map = new google.maps.Map(document.getElementById("map"),{
zoom: 11,center: {
lat: 41.876,lng: -87.624
},});
const ctaLayer = new google.maps.KmlLayer({
url: "http://www.geocodezip.com/geoxml3_test/kml/SO_20201106_removeSpaces.kml",map: map,});
}
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html,body {
height: 100%;
margin: 0;
padding: 0;
}
<!DOCTYPE html>
<html>
<head>
<title>KML Layers</title>
<script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap&libraries=&v=weekly" defer></script>
<!-- jsFiddle will insert css and js -->
</head>
<body>
<div id="map"></div>
</body>
</html>