該URL使用Google Maps Javascript API v3 KmlLayer來呈現KML。
// Add static regions KML
var regionsLayer = new google.maps.KmlLayer({
url: 'http://wildfire.alberta.ca/apps/wildfirestatusmap/DataFiles/esrd_wma.kmz'
});
regionsLayer.setZIndex(1);
regionsLayer.setMap(map);
// Add dynamic markers
var wildfiresLayer = new google.maps.KmlLayer({
//url: 'http://wildfire.alberta.ca/wildfire-status/status-map-handler.ashx?type=map'
url: 'http://wildfire.alberta.ca/apps/wildfirestatusmap/status-map-handler.ashx?type=map'
});
wildfiresLayer.setZIndex(10);
wildfiresLayer.setMap(map);
代碼片段:
function initialize() {
var map = new google.maps.Map(
document.getElementById("map_canvas"), {
center: new google.maps.LatLng(37.4419, -122.1419),
zoom: 13,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
// Add static regions KML
var regionsLayer = new google.maps.KmlLayer({
url: 'http://wildfire.alberta.ca/apps/wildfirestatusmap/DataFiles/esrd_wma.kmz'
});
regionsLayer.setZIndex(1);
regionsLayer.setMap(map);
// Add dynamic markers
var wildfiresLayer = new google.maps.KmlLayer({
//url: 'http://wildfire.alberta.ca/wildfire-status/status-map-handler.ashx?type=map'
url: 'http://wildfire.alberta.ca/apps/wildfirestatusmap/status-map-handler.ashx?type=map'
});
wildfiresLayer.setZIndex(10);
wildfiresLayer.setMap(map);
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
height: 100%;
width: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map_canvas"></div>
這是偉大的!我可以在其他客戶端訪問該KML。但是我還是不清楚你是如何(具體地說)得到了路徑。所以這是我鏈接http://wildfire.alberta.ca/apps/wildfirestatusmap/DataFiles/esrd_wma.kmz的鏈接,當我在上面引用的原始頁面上查看源代碼時,它不在那裏。所以我認爲它必須在腳本或其他與htmls頁面相關的文件中 - 這是列出.kmz層的頁面url –