我有一个很小的自定义地图,通过MapTiler创建,很容易让它用GMaps渲染。所需的几行代码的基础知识如下。
我有一个可爱的小KML图层,渲染得很好。
然而......对于我的生活,我无法让两个图层一起显示。一旦指示KML渲染,自定义地图图层就会消失。 Firebug甚至告诉我,我的自定义瓷砖甚至都没有要求!理想情况下,我需要在自定义地图图层上使用KML图层。它将显示几个英国地标的位置。
在我的脑海里,我正在考虑投影类型和冲突,但是当两个图层在基本地图上单独渲染时,我真的处于黑暗中。
任何人都可以在Google Maps V3中通过自定义地图类型向我提供有关KML图层的建议吗?
谢谢
var MyCustomMapType = new google.maps.ImageMapType({
getTileUrl: function(tile, zoom) {
return "/static/images/maps/uk/" + zoom+"/"+tile.x+"/"+ tile.y +".png";
},
tileSize: new google.maps.Size(256, 256),
});
function init(){
var mapOpts = {
zoom: 6,
center: new google.maps.LatLng(53.94315470224928, -3.515625),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOpts);
map.overlayMapTypes.insertAt(0, MyCustomMapType);
var cathedrals = new google.maps.KmlLayer('http://pointing_at_my/kml/');
// as soon as this executes, ImageMapType layer disappears
cathedrals.setMap(map);
}
答案 0 :(得分:0)
解决。只是不要做白痴。
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var map, cathedrals;
var ukOverlay = new google.maps.ImageMapType({
getTileUrl: function(coord, zoom) {
var ymax = 1 << zoom;
var y = ymax - coord.y -1;
return "/static/images/maps/uk/" + zoom+"/"+coord.x+"/"+y+".png";
},
tileSize: new google.maps.Size(256, 256),
isPng: true
});
function init(){
var mapOpts = {
zoom: 6,
center: new google.maps.LatLng(54.40315470224928, -3.515625),
mapTypeId: google.maps.MapTypeId.HYBRID ,
disableDefaultUI: false,
mapTypeControl: false,
scrollwheel: false,
navigationControl: false,
mapTypeControl: false,
scaleControl: false,
draggable: false
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOpts);
cathedrals = new google.maps.KmlLayer('http://cathedralcafes.co.uk/kml/', {preserveViewport: true});
map.overlayMapTypes.insertAt(0, ukOverlay);
cathedrals.setMap(map);
}
</script>