2011-07-01 148 views
0

我有兩個覆蓋使用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> 

回答

0

也許ü可以從圖1使用getCenter和

+0

所以你說的這些我都可以調用一個函數的事件u的移動鼠標使用latlang到setCenter第二這將做你說什麼,只要鼠標按下! ? –

+0

不是,當你拖動地圖,每拖動或移動事件,獲取地圖的中心(拉特朗),並設置中心,拉特朗其他地圖 – hungryMind

+0

好的。謝謝,但我對所有這些東西都有點新鮮,所以如果你有任何樣品請告訴。 –