如何使用div同时覆盖两个地图覆盖

我有两个覆盖使用div的地图。但是，每当我平移地图时，只有底图上方的地图会移动，而不是底图。请告诉我们是否有办法让两个地图同时启用鼠标平移。感谢 Astha如何使用div同时覆盖两个地图覆盖

<style type='text/css'> 
/*<![CDATA[*/ 

.modal { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 

} 
.overlay { 
    margin: auto; 
    text-align: left; 
    width: 800px; 
    height: 532px; 
    position:absolute; 
    pointer-events:none; 
} 

.message { 
    width: 800px; 
    height: 532px; 

    background-color: #fff; 
    opacity: .35; 
    filter: alpha(opacity=35); 
    position:absolute; 
    pointer-events:none; 
} 




    /*]]>*/ 
</style> 
<script type="text/javascript" src="http://nls.tileserver.com/api.js"></script> 
<script src="http://maps.google.com/maps? file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAA9pSslyaYyyl6x8HKrHAZvxS4-alJFZ9Cxp3qiYSlGHIYxF9uHhT0NLb9B9BXGUGGDctSO4QVa1jLLA" type="text/javascript"> 
</script> 
<script src="http://nls.tileserver.com/opacity-control.js" type="text/javascript">  </script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.0.0/prototype.js"></script> 
<script language="javascript"> 

function whereami(lat, lon) { 
load(lat,lon); 
} 
/* 
function pull() { 
var location=JSON.parse(locater.getLocation()); 

whereami(location.lat, location.lon); 
}*/ 
function load(latitude,longitude) 
{ 

if (GBrowserIsCompatible()) { 
    //var latitude = 55.96; 
    //var longitude = -3.2; 
    var MyIcon = new GIcon(); 
    var zoom = 18; 
    var map = new GMap(document.getElementById("map")); 
    map.setCenter(new GLatLng(latitude,longitude), zoom); 
    var copyright = new GCopyright(1, new GLatLngBounds(new GLatLng(-90, -180),new GLatLng(90, 180)), 1, 
    "Historical maps from <a href='http://geo.nls.uk/maps/api/'>NLS Maps API<\/a>"); 
    var copyrightCollection = new GCopyrightCollection(); 
    copyrightCollection.addCopyright(copyright); 



    var tilelayer = new GTileLayer(copyrightCollection, 1, NLSTileUrlOS('MAXZOOM')); 
    tilelayer.getTileUrl = NLSTileUrlOS; 
    var nlsmap = new GMapType([tilelayer], G_NORMAL_MAP.getProjection(), "Historical"); 
    map.addMapType(nlsmap); 
    map.setMapType(nlsmap); 

    var map1 = new GMap(document.getElementById("map1")); 
    map1.setCenter(new GLatLng(latitude,longitude), zoom); 
    var copyright = new GCopyright(1, new GLatLngBounds(new GLatLng(-90, -180),new GLatLng(90, 180)), 1, 
    "Historical maps from <a href='http://geo.nls.uk/maps/api/'>NLS Maps API<\/a>"); 
    var copyrightCollection = new GCopyrightCollection(); 
    copyrightCollection.addCopyright(copyright); 

    var tilelayer = new GTileLayer(copyrightCollection, 1, NLSTileUrlOS('MAXZOOM')); 
    tilelayer.getTileUrl = NLSTileUrlOS; 
    var nlsmap = new GMapType([tilelayer], G_NORMAL_MAP.getProjection(), "Historical"); 
    map1.addMapType(nlsmap); 
    map1.setMapType(nlsmap); 
    // put div over map 
Position.clone($("map"), $("map1").setStyle({'pointer-events': 'none'}), {offsetLeft:100, offsetTop:62.5, setWidth:false, setHeight:false}); 


    var marker = new GMarker(new GLatLng(latitude,longitude)); 
    var myIcon=new GIcon(marker.getIcon()); 
    myIcon.image='pushpin.png'; 
    myIcon.iconSize = new GSize (40,40); 
    var marker2 = new GMarker(new GLatLng(latitude,longitude), myIcon); 
    map.addOverlay(marker2); 




    } 
} 
</script > 
</head> 
<body onload = whereami(55.96,-3.2)> 
<div class="modal"> 
    <div class="overlay" id="map"> 

    </div> 
    <div class="message" id="map1"></div> 
</div>

来源

2011-07-01 Astha Devra

也许ü可以从图1使用getCenter和

来源

2011-07-01 12:37:42 hungryMind

所以你说的这些我都可以调用一个函数的事件u的移动鼠标使用latlang到setCenter第二这将做你说什么，只要鼠标按下！？ –

不是，当你拖动地图，每拖动或移动事件，获取地图的中心（拉特朗），并设置中心，拉特朗其他地图 – hungryMind

好的。谢谢，但我对所有这些东西都有点新鲜，所以如果你有任何样品请告诉。 –

如何使用div同时覆盖两个地图覆盖

回答

相关问题