From 44c675c48fbbf5d37947249baa6bec7c80cb8e42 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C3=89ric=20Lemoine?= Date: Thu, 31 Mar 2011 14:32:54 +0000 Subject: [PATCH] add mobile-layers example, demonstrating that data from various layer/format types can be displayed on mobile, p=cmoullet, r=me (closes #3223) git-svn-id: http://svn.openlayers.org/trunk/openlayers@11844 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf --- examples/mobile-layers.html | 98 +++++++++++++++++++++++++++++++++++++ examples/mobile-layers.js | 72 +++++++++++++++++++++++++++ 2 files changed, 170 insertions(+) create mode 100644 examples/mobile-layers.html create mode 100644 examples/mobile-layers.js diff --git a/examples/mobile-layers.html b/examples/mobile-layers.html new file mode 100644 index 0000000000..b7052d504b --- /dev/null +++ b/examples/mobile-layers.html @@ -0,0 +1,98 @@ + + + + OpenLayers Mobile Layers + + + + + + + + + +

Mobile example with various layer types

+ +
+ mobile, WMS, WFS, KML +
+

+ A mobile example displaying various layer types: WMS, WFS, KML. +

+ +
+ + + diff --git a/examples/mobile-layers.js b/examples/mobile-layers.js new file mode 100644 index 0000000000..30b9cc5677 --- /dev/null +++ b/examples/mobile-layers.js @@ -0,0 +1,72 @@ +// initialize map when page ready +var map; + +// Get rid of address bar on iphone/ipod +var fixSize = function() { + window.scrollTo(0, 0); + document.body.style.height = '100%'; + if (!(/(iphone|ipod)/.test(navigator.userAgent.toLowerCase()))) { + if (document.body.parentNode) { + document.body.parentNode.style.height = '100%'; + } + } +}; +setTimeout(fixSize, 700); +setTimeout(fixSize, 1500); + +// allow testing of specific renderers via "?renderer=Canvas", etc +var renderer = OpenLayers.Util.getParameters(window.location.href).renderer; +renderer = (renderer) ? [renderer] : OpenLayers.Layer.Vector.prototype.renderers; + +OpenLayers.ProxyHost = "proxy.cgi?url="; + +function init() { + + map = new OpenLayers.Map({ + div: "map", + theme: null, + controls: [ + new OpenLayers.Control.Attribution(), + new OpenLayers.Control.TouchNavigation({ + dragPanOptions: { + interval: 100, + enableKinetic: true + } + }), + new OpenLayers.Control.ZoomPanel() + ] + }); + + var wms = new OpenLayers.Layer.WMS("OpenLayers WMS", + "http://vmap0.tiles.osgeo.org/wms/vmap0", + {layers: 'basic'}, + {isBaseLayer: true, transitionEffect: 'resize'} + ) + + var kml = new OpenLayers.Layer.Vector("KML", { + projection: map.displayProjection, + strategies: [new OpenLayers.Strategy.Fixed()], + protocol: new OpenLayers.Protocol.HTTP({ + url: "kml/sundials.kml", + format: new OpenLayers.Format.KML({ + extractStyles: true, + extractAttributes: true + }) + }), + renderers: renderer + }); + + var wfs = new OpenLayers.Layer.Vector("States", { + strategies: [new OpenLayers.Strategy.Fixed()], + protocol: new OpenLayers.Protocol.WFS({ + url: "http://demo.opengeo.org/geoserver/wfs", + featureType: "states", + featureNS: "http://www.openplans.org/topp" + }), + renderers: renderer + }); + + map.addLayers([wms, wfs, kml]); + + map.setCenter(new OpenLayers.LonLat(-104, 42), 3); +};