谷歌地图 - 加载KML覆盖
问题描述:
我想显示的地图,放大到一个邮编,然后将国会区叠加到地图。叠加是在这里:https://www.google.com/fusiontables/DataSource?snapid=S506424n-DY谷歌地图 - 加载KML覆盖
我下载KML链接文件,并将其保存到我的本地IIS服务器。但是,覆盖层永远不会被绘制。
我还增加了以下MIME类型,以我的IIS服务器:
.kml application/vnd.google-earth.kml+xml
.kmz application/vnd.google-earth.kmz
KML文件看起来是这样的:
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://www.opengis.net/kml/2.2">
<NetworkLink>
<name><![CDATA[2012 US Congressional Districts]]></name>
<Link>
<href>
https://www.google.com/fusiontables/exporttable?query=select+col5+from+1QlQxBF17RR-89NCYeBmw4kFzOT3mLENp60xXAJM&o=kmllink&g=col5</href>
</Link>
我的HTML/JavaScript的样子:
<script src="http://maps.googleapis.com/maps/api/js" type="text/javascript"></script>
<script language="javascript">
var map;
var marker;
function showAddress() {
$("#divGoogleMap").css('display', '');
var mapProp = {
center: new google.maps.LatLng(51.508742, -0.120850),
zoom: 11,
mapTypeId: google.maps.MapTypeId.TERRAIN
};
map = new google.maps.Map(document.getElementById("divGoogleMap"), mapProp);
myListener = google.maps.event.addListener(map, 'click', function (event) {
placeMarker(event.latLng);
});
google.maps.event.addListener(map, 'drag', function (event) {
placeMarker(event.latLng);
});
var zipCode = $("#txtZip").val();
var geocoder = new google.maps.Geocoder();
geocoder.geocode({ 'address': zipCode }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
//Got result, center the map and put it out there
var pos = results[0].geometry.location;
saveLocation(pos);
map.setCenter(pos);
marker = new google.maps.Marker({
map: map,
draggable: true,
position: pos
});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
var kmlUrl = '/DesktopModules/HelloWorld/2012_US_Congressional_Districts.kml';
var kmlOptions = {
suppressInfoWindows: true,
preserveViewport: false,
map: map
};
var kmlLayer = new google.maps.KmlLayer(kmlUrl, kmlOptions);
}
function placeMarker(location) {
if (marker) {
marker.setPosition(location);
} else {
marker = new google.maps.Marker({
position: location,
map: map,
draggable: true
});
google.maps.event.addListener(marker, "drag", function (mEvent) {
populateInputs(mEvent.latLng);
});
}
saveLocation(location);
}
function saveLocation(pos) {
$("#hfLatitude").val(pos.lat());
$("#hfLogitude").val(pos.lng());
}
</script>
<table cellpadding="2" cellspacing="2" border="0">
<tr>
<td>
<asp:TextBox ID="txtZip" ClientIDMode="Static" runat="server"></asp:TextBox>
</td>
<td>
<input type="button" id="btnSearch" value="Search" onclick="showAddress()" />
</td>
</tr>
</table>
<div id="divGoogleMap" style="width: 800px;height: 600px;display: none;"></div>
<asp:HiddenField ID="hfLatitude" ClientIDMode="Static" runat="server" />
<asp:HiddenField ID="hfLongitude" ClientIDMode="Static" runat="server" />
我在这里做错了什么?
答
在谷歌地图使用日KML必须位于一个可访问服务器E不在本地。
这是谷歌文档格式。
概述
的谷歌地图API支持 的KML和GeoRSS数据格式显示地理信息。这些数据格式使用KmlLayer对象显示在地图上 ,其构造函数采用可公开访问的KML或GeoRSS文件的URL。
构造带可公开访问的KML的网址。
那么对于yoour需要你必须把你的KML在可公开访问的服务器
我已经忘记了,我已经有过类似的经历,几年前和解决方案正是为了放置文件KML访问的服务器上来自网络。 。
我设置显示回来,当我按一下按钮:$( “#divGoogleMap”)的CSS( '显示', '');问题不在于地图没有显示出来。地图确实出现。只是不要覆盖。 –
只为yucks。我删除了显示:无。同样的问题... –
然后在这种情况下可能是一个路径问题。检查kml – scaisEdge