0

我有两张使用 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>

4

1 回答 1

0

可能您可以使用地图 1 中的 getCenter 并使用 latlang 在您移动鼠标的事件中设置第二个中心

于 2011-07-01T12:37:42.233 回答