1 <html xmlns="http://www.w3.org/1999/xhtml">
3 <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
4 <link rel="stylesheet" href="style.css" type="text/css" />
5 <script src="../lib/OpenLayers.js"></script>
6 <script type="text/javascript">
10 map = new OpenLayers.Map('map',
11 {controls: [new OpenLayers.Control.Navigation(),
12 new OpenLayers.Control.PanZoomBar()],
14 var wms = new OpenLayers.Layer.WMS(
16 "http://labs.metacarta.com/wms/vmap0",
21 map.events.register("moveend", null, displayZoom);
23 map.zoomToMaxExtent();
25 update(document.getElementById("fractional"));
29 function displayZoom() {
30 document.getElementById("zoom").innerHTML = map.zoom.toFixed(4);
33 function update(input) {
34 map.fractionalZoom = input.checked;
35 map.zoomTo(Math.round(map.zoom));
39 <body onload="init()">
40 <h1 id="title">Fractional Zoom Example</h1>
45 Shows the use of a map with fractional (or non-discrete) zoom levels.
48 <div id="map" class="smallmap"></div>
49 <input type="checkbox" name="fractional"
50 id="fractional" checked="checked" onclick="update(this)" />
51 <label for="fractional">Fractional Zoom</label>
52 (zoom: <span id="zoom"></span>)
56 Setting the map.fractionalZoom property to true allows zooming to
57 an arbitrary level (between the min and max resolutions). This
58 can be demonstrated by shift-dragging a box to zoom to an arbitrary