[OpenLayers-Commits] r11725 - sandbox/cmoullet/openlayers/examples

commits-20090109 at openlayers.org commits-20090109 at openlayers.org
Tue Mar 22 15:54:32 EDT 2011


Author: cmoullet
Date: 2011-03-22 12:54:31 -0700 (Tue, 22 Mar 2011)
New Revision: 11725

Added:
   sandbox/cmoullet/openlayers/examples/geoadmin.html
   sandbox/cmoullet/openlayers/examples/geoadmin.js
Log:
Test version


Added: sandbox/cmoullet/openlayers/examples/geoadmin.html
===================================================================
--- sandbox/cmoullet/openlayers/examples/geoadmin.html	                        (rev 0)
+++ sandbox/cmoullet/openlayers/examples/geoadmin.html	2011-03-22 19:54:31 UTC (rev 11725)
@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html>
+    <head>
+    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+        <title>GeoAdmin with Sencha Touch</title>
+        <script src="../lib/OpenLayers.js?mobile"></script>
+        <link rel="stylesheet" href="style.mobile.css" type="text/css">
+        <link rel="stylesheet" href="http://dev.sencha.com/deploy/touch/resources/css/sencha-touch.css">
+        <script src="http://dev.sencha.com/deploy/touch/sencha-touch.js"></script>
+        <script src="http://proj4js.org/lib/proj4js-compressed.js"></script>
+        <script src="http://proj4js.org/lib/defs/EPSG21781.js"></script>
+        <script src="geoadmin.js"></script>
+        <style>
+            .searchList {
+                min-height: 150px;
+            }
+            .close-btn {
+                position: absolute;
+                right: 10px;
+                top: 10px;
+            }
+            img.minus {
+                -webkit-mask-image: url(img/minus1.png);
+            }
+            img.layers {
+                -webkit-mask-image: url(img/list.png);
+            }
+            .gx-layer-item {
+                margin-left: 10px;
+            }
+            #map {
+                width: 100%;
+                height: 100%;
+            }
+            .olControlAttribution {
+                font-size: 10px;
+                bottom: 5px;
+                right: 5px;
+            }
+            #title, #tags, #shortdesc {
+                display: none;
+            }
+        </style>
+        <script>
+
+        var app = new Ext.Application({
+            name: "ol",
+            launch: function() {
+                this.viewport = new Ext.Panel({
+                    fullscreen: true,
+                    dockedItems: [{
+                        dock: "top",
+                        xtype: "toolbar",
+                        ui: "light",
+                        layout: {
+                            pack: "center"
+                        },
+                        items: [{
+                            xtype: "spacer"
+                        }, {
+                            iconMask: true,
+                            iconCls: "add",
+                            handler: function() {
+                                map.zoomIn();
+                            }
+                        }, {
+                            iconMask: true,
+                            iconCls: "minus",
+                            handler: function() {
+                                map.zoomOut();
+                            }
+                        }]
+                    }],
+                    items: [
+                        {
+                            xtype: "component",
+                            scroll: false,
+                            monitorResize: true,
+                            id: "map",
+                            listeners: {
+                                render: init,
+                                resize: function() {
+                                    if (window.map) {
+                                        map.updateSize();
+                                    }
+                                }
+                            }
+                        }
+                    ]
+                });
+            }
+        });
+        </script>
+    </head>
+    <body>
+        <h1 id="title">GeoAdmin</h1>
+        <div id="tags">
+            mobile, sencha touch, geoadmin
+        </div>
+        <p id="shortdesc">
+            Example of GeoAdmin Usage.
+        </p>
+    </body>
+</html>

Added: sandbox/cmoullet/openlayers/examples/geoadmin.js
===================================================================
--- sandbox/cmoullet/openlayers/examples/geoadmin.js	                        (rev 0)
+++ sandbox/cmoullet/openlayers/examples/geoadmin.js	2011-03-22 19:54:31 UTC (rev 11725)
@@ -0,0 +1,69 @@
+// initialize map when page ready
+var map;
+var pixelmap;
+var sm = new OpenLayers.Projection("EPSG:21781");
+
+var init = function () {
+
+    var geolocate = new OpenLayers.Control.Geolocate({
+        id: 'locate-control',
+        watch: true,
+        geolocationOptions: {
+            enableHighAccuracy: false,
+            maximumAge: 0,
+            timeout: 7000
+        }
+    });
+
+    geolocate.events.register("locationupdated", this, function(e) {
+        map.zoomTo(8);
+    });
+
+    geolocate.activate();
+
+    var layer_options = {
+        projection: new OpenLayers.Projection('EPSG:21781'),
+        units: 'm',
+        serverResolutions: [4000,3750,3500,3250,3000,2750,2500,2250,2000,1750,1500,
+            1250,1000,750,650,500,250,100,50,20,10,5,2.5,2,1.5,1,0.5],
+        format: "image/jpeg",
+        transitionEffect: "resize",
+        buffer: 0,
+        opacity: 1.0
+    };
+
+    var url = [
+        'http://tile5.geo.admin.ch/geoadmin/',
+        'http://tile6.geo.admin.ch/geoadmin/',
+        'http://tile7.geo.admin.ch/geoadmin/',
+        'http://tile8.geo.admin.ch/geoadmin/',
+        'http://tile9.geo.admin.ch/geoadmin/'
+    ];
+    pixelmap = new OpenLayers.Layer.TileCache("ch.swisstopo.pixelkarte-farbe", url, "ch.swisstopo.pixelkarte-farbe", layer_options);
+
+    // create map
+    map = new OpenLayers.Map({
+        div: "map",
+        theme: null,
+        projection: sm,
+        units: "m",
+        maxExtent: new OpenLayers.Bounds(420000, 30000, 900000, 350000),
+        resolutions: [650.0, 500.0, 250.0, 100.0, 50.0, 20.0, 10.0, 5.0 ,2.5, 2.0, 1.0, 0.5],
+        controls: [
+            new OpenLayers.Control.Attribution(),
+            new OpenLayers.Control.TouchNavigation({
+                dragPanOptions: {
+                    interval: 100,
+                    enableKinetic: true
+                }
+            }),
+            geolocate
+        ],
+        layers: [
+            pixelmap
+        ],
+        center: new OpenLayers.LonLat(600000, 200000),
+        zoom: 1
+    });
+    map.zoomToMaxExtent();
+};



More information about the Commits mailing list