Geoxml3 groundOverlay zIndex [英] Geoxml3 groundOverlay zIndex

查看:144
本文介绍了Geoxml3 groundOverlay zIndex的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

有没有办法改变一个groundOverlay的zIndex?

使用Geoxml3我解析两个KML文件,其中一个包含一个多边形,另一个包含一个多边形一个groundOverlay。更新:
这是我的代码,除了这个事实,我希望我的groundOverlay覆盖多边形,因为现在groundOverlay出现在多边形后面。



更新:
这是我的代码

 <!DOCTYPE html> 
< html>
< head>
< meta name =viewportcontent =initial-scale = 1.0,user-scalable = no/>
< meta http-equiv =content-typecontent =text / html; charset = UTF-8/>
< title> Geoxml3< / title>
< style>
{height:100%;}
body {height:100%; margin:0px;}
#map_canvas {height:90%; width:90%;}
< /风格>

< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js><<< ; /脚本>

< script src =https://maps.googleapis.com/maps/api/js?sensor=false>< / script>
< script type =text / javascriptsrc =http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js>< / script>
< script type =text / javascriptsrc =http://geoxml3.googlecode.com/svn/trunk/ProjectedOverlay.js>
< / script>
< / head>
< body>
< div id =map_canvas>< / div>
< / div>
< script type =text / javascript>
var geoXml = null,map = null;

函数initialize(){
var myOptions = {
center:new google.maps.LatLng(39.397,-100.644),
zoom:4,
mapTypeId:google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById(map_canvas),myOptions);
$ b geoXml = new geoXML3.parser({
map:map,
zoom:true,
createOverlay:addMyOverlay
});

geoXml.parse(['groundOverlay.kml','polygon.kml']);

函数addMyOverlay(placemark,doc){
//如何更改GroundOverlay zIndex
var groundOverlay = geoXml.createOverlay(placemark);
return groundOverlay;
};
};
google.maps.event.addDomListener(window,'load',initialize);

< / script>
< / body>
< / html>

测试如下:
http://jorgeluisperez.260mb.net/geoxml/

解决方案

一旦地图加载,最简单的方法可能是为 GroundOverlay 指定 zIndex



$ p $ google.maps.event.addListenerOnce(map,'idle',function(){
var overlayDiv = document.getElementById(groundOverlay .id_);
overlayDiv.style.zIndex ='999';
console.log(overlayDiv);
});




注意: groundOverlay 应该可以从事件中访问

工作示例: Plunker


Is there a way to change the zIndex of a groundOverlay?

With Geoxml3 I am parsing two KML files, one of them contains a polygon and the other one contains a groundOverlay. Everythings goes perfect except for the fact that i want my groundOverlay OVER the polygon, because now the groundOverlay appears behind the polygon.

Update: This is my code

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Geoxml3</title>
<style>
    html{height:100%;}
    body{height:100%;margin:0px;}
    #map_canvas{height: 90%;width: 90%;}
</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script>
<script type="text/javascript" src="http://geoxml3.googlecode.com/svn/trunk/ProjectedOverlay.js">
</script>
</head>
<body>
<div id="map_canvas"></div>
</div>
<script type="text/javascript">
var geoXml=null, map=null;

function initialize() {
    var myOptions = {
        center: new google.maps.LatLng(39.397, -100.644),
        zoom: 4,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    geoXml = new geoXML3.parser({
        map: map,
        zoom: true,
        createOverlay: addMyOverlay
    });

    geoXml.parse(['groundOverlay.kml','polygon.kml']);

    function addMyOverlay(placemark,doc){
        //How to change the the GroundOverlay zIndex
        var groundOverlay = geoXml.createOverlay(placemark);
        return groundOverlay;
    };
};
google.maps.event.addDomListener(window, 'load', initialize);

</script>
</body>
</html>

The test is here: http://jorgeluisperez.260mb.net/geoxml/

解决方案

Probably the easiest way would be to specify zIndex for GroundOverlay once the map is loaded:

google.maps.event.addListenerOnce(map, 'idle', function(){
      var overlayDiv = document.getElementById(groundOverlay.id_);
      overlayDiv.style.zIndex = '999';
      console.log(overlayDiv);
});  

Note: groundOverlay should be accessible from event

Working example: Plunker

这篇关于Geoxml3 groundOverlay zIndex的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆