6568eb4d8a
git-svn-id: http://svn.openlayers.org/trunk/openlayers@9771 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
123 lines
4.4 KiB
HTML
123 lines
4.4 KiB
HTML
<html xmlns="http://www.w3.org/1999/xhtml">
|
|
<head>
|
|
<title>Google Panning Acceptance Test</title>
|
|
<style type="text/css">
|
|
|
|
body {
|
|
font-size: 0.8em;
|
|
}
|
|
p {
|
|
padding-top: 1em;
|
|
}
|
|
|
|
#evenmap {
|
|
margin: 1em;
|
|
float: left;
|
|
width: 256px;
|
|
height: 256px;
|
|
}
|
|
|
|
#oddmap {
|
|
margin: 1em;
|
|
float: left;
|
|
width: 255px;
|
|
height: 255px;
|
|
}
|
|
|
|
/* avoid pink tiles */
|
|
.olImageLoadError {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
</style>
|
|
|
|
<script src='http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
|
|
|
|
<script src="../../lib/OpenLayers.js"></script>
|
|
<script type="text/javascript">
|
|
|
|
var evenmap, oddmap;
|
|
|
|
// increase reload attempts
|
|
OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
|
|
|
|
function init(){
|
|
evenmap = new OpenLayers.Map('evenmap');
|
|
var evenlayer = new OpenLayers.Layer.Google(
|
|
"Imagery",
|
|
{type: G_SATELLITE_MAP}
|
|
);
|
|
evenmap.addLayer(evenlayer);
|
|
var epc = document.getElementById("epc");
|
|
var emc = document.getElementById("emc");
|
|
var ee = document.getElementById("ee");
|
|
evenmap.events.register("moveend", null, function() {
|
|
var px = new OpenLayers.Pixel(evenmap.size.w / 2,
|
|
evenmap.size.h / 2);
|
|
var pc = evenmap.getLonLatFromViewPortPx(px);
|
|
pc.lon = parseFloat(pc.lon.toPrecision(6));
|
|
pc.lat = parseFloat(pc.lat.toPrecision(6));
|
|
var mc = evenmap.baseLayer.getOLLonLatFromMapObjectLonLat(
|
|
evenmap.baseLayer.mapObject.getCenter()
|
|
);
|
|
mc.lon = parseFloat(mc.lon.toPrecision(6));
|
|
mc.lat = parseFloat(mc.lat.toPrecision(6));
|
|
epc.innerHTML = "(" + pc.lon + ", " + pc.lat + ")";
|
|
emc.innerHTML = "(" + mc.lon + ", " + mc.lat + ")";
|
|
ee.innerHTML = pc.equals(mc);
|
|
});
|
|
evenmap.zoomToMaxExtent();
|
|
|
|
oddmap = new OpenLayers.Map('oddmap');
|
|
var oddlayer = new OpenLayers.Layer.Google(
|
|
"Imagery",
|
|
{type: G_SATELLITE_MAP}
|
|
);
|
|
oddmap.addLayer(oddlayer);
|
|
var opc = document.getElementById("opc");
|
|
var omc = document.getElementById("omc");
|
|
var oe = document.getElementById("oe");
|
|
oddmap.events.register("moveend", null, function() {
|
|
var px = new OpenLayers.Pixel(oddmap.size.w / 2,
|
|
oddmap.size.h / 2);
|
|
var pc = oddmap.getLonLatFromViewPortPx(px);
|
|
pc.lon = parseFloat(pc.lon.toPrecision(6));
|
|
pc.lat = parseFloat(pc.lat.toPrecision(6));
|
|
var mc = oddmap.baseLayer.getOLLonLatFromMapObjectLonLat(
|
|
oddmap.baseLayer.mapObject.getCenter()
|
|
);
|
|
mc.lon = parseFloat(mc.lon.toPrecision(6));
|
|
mc.lat = parseFloat(mc.lat.toPrecision(6));
|
|
opc.innerHTML = "(" + pc.lon + ", " + pc.lat + ")";
|
|
omc.innerHTML = "(" + mc.lon + ", " + mc.lat + ")";
|
|
oe.innerHTML = pc.equals(mc);
|
|
});
|
|
oddmap.zoomToMaxExtent();
|
|
|
|
}
|
|
|
|
</script>
|
|
</head>
|
|
<body onload="init()">
|
|
<div id="evenmap"></div>
|
|
<p><b>Even sized map.</b> The map on the left should pan regularly, and the
|
|
two centers below should be equivalent. Both dragging and panning with
|
|
buttons should maintain the same center.</p>
|
|
<p><b>pixel center:</b> <span id="epc"></span>
|
|
<br /><b>map center:</b> <span id="emc"></span>
|
|
<br /><b>equvalent:</b> <span id="ee"></span>
|
|
</p>
|
|
<br style="clear: both;" />
|
|
|
|
<div id="oddmap"></div>
|
|
<p><b>Odd sized map.</b> The map on the left should pan regularly, and the
|
|
two centers below should be equivalent. Both dragging and panning with
|
|
buttons should maintain the same center.</p>
|
|
<p><b>pixel center:</b> <span id="opc"></span>
|
|
<br /><b>map center:</b> <span id="omc"></span>
|
|
<br /><b>equvalent:</b> <span id="oe"></span>
|
|
</p>
|
|
</ul>
|
|
</body>
|
|
</html>
|