как панорамировать две карты одновременно с помощью div - PullRequest
0 голосов
/ 01 июля 2011

У меня есть две карты, которые наложены с использованием 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>

1 Ответ

0 голосов
/ 01 июля 2011

Возможно, вы можете использовать getCenter с карты 1 и использовать latlang для установки центра секунды для событий, когда вы двигаете мышь

...