1 <html xmlns="http://www.w3.org/1999/xhtml">
3 <title>Google Panning Acceptance Test</title>
4 <style type="text/css">
30 <script src='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
32 <script src="../../lib/OpenLayers.js"></script>
33 <script type="text/javascript">
36 OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
37 OpenLayers.Util.onImageLoadErrorColor = "transparent";
40 evenmap = new OpenLayers.Map('evenmap');
41 var evenlayer = new OpenLayers.Layer.Google(
43 {type: G_SATELLITE_MAP}
45 evenmap.addLayer(evenlayer);
46 var epc = document.getElementById("epc");
47 var emc = document.getElementById("emc");
48 var ee = document.getElementById("ee");
49 evenmap.events.register("moveend", null, function() {
50 var px = new OpenLayers.Pixel(evenmap.size.w / 2,
52 var pc = evenmap.getLonLatFromViewPortPx(px);
53 pc.lon = parseFloat(pc.lon.toPrecision(6));
54 pc.lat = parseFloat(pc.lat.toPrecision(6));
55 var mc = evenmap.baseLayer.getOLLonLatFromMapObjectLonLat(
56 evenmap.baseLayer.mapObject.getCenter()
58 mc.lon = parseFloat(mc.lon.toPrecision(6));
59 mc.lat = parseFloat(mc.lat.toPrecision(6));
60 epc.innerHTML = "(" + pc.lon + ", " + pc.lat + ")";
61 emc.innerHTML = "(" + mc.lon + ", " + mc.lat + ")";
62 ee.innerHTML = pc.equals(mc);
64 evenmap.zoomToMaxExtent();
66 oddmap = new OpenLayers.Map('oddmap');
67 var oddlayer = new OpenLayers.Layer.Google(
69 {type: G_SATELLITE_MAP}
71 oddmap.addLayer(oddlayer);
72 var opc = document.getElementById("opc");
73 var omc = document.getElementById("omc");
74 var oe = document.getElementById("oe");
75 oddmap.events.register("moveend", null, function() {
76 var px = new OpenLayers.Pixel(oddmap.size.w / 2,
78 var pc = oddmap.getLonLatFromViewPortPx(px);
79 pc.lon = parseFloat(pc.lon.toPrecision(6));
80 pc.lat = parseFloat(pc.lat.toPrecision(6));
81 var mc = oddmap.baseLayer.getOLLonLatFromMapObjectLonLat(
82 oddmap.baseLayer.mapObject.getCenter()
84 mc.lon = parseFloat(mc.lon.toPrecision(6));
85 mc.lat = parseFloat(mc.lat.toPrecision(6));
86 opc.innerHTML = "(" + pc.lon + ", " + pc.lat + ")";
87 omc.innerHTML = "(" + mc.lon + ", " + mc.lat + ")";
88 oe.innerHTML = pc.equals(mc);
90 oddmap.zoomToMaxExtent();
96 <body onload="init()">
97 <div id="evenmap"></div>
98 <p><b>Even sized map.</b> The map on the left should pan regularly, and the
99 two centers below should be equivalent. Both dragging and panning with
100 buttons should maintain the same center.</p>
101 <p><b>pixel center:</b> <span id="epc"></span>
102 <br /><b>map center:</b> <span id="emc"></span>
103 <br /><b>equvalent:</b> <span id="ee"></span>
105 <br style="clear: both;" />
107 <div id="oddmap"></div>
108 <p><b>Odd sized map.</b> The map on the left should pan regularly, and the
109 two centers below should be equivalent. Both dragging and panning with
110 buttons should maintain the same center.</p>
111 <p><b>pixel center:</b> <span id="opc"></span>
112 <br /><b>map center:</b> <span id="omc"></span>
113 <br /><b>equvalent:</b> <span id="oe"></span>