summaryrefslogtreecommitdiff
path: root/misc/openlayers/examples/dynamic-text-layer.html
diff options
context:
space:
mode:
authorChris Schlaeger <chris@linux.com>2014-08-12 21:56:44 +0200
committerChris Schlaeger <chris@linux.com>2014-08-12 21:56:44 +0200
commitea346a785dc1b3f7c156f6fc33da634e1f1a627b (patch)
treeaf67530553d20b6e82ad60fd79593e9c4abf5565 /misc/openlayers/examples/dynamic-text-layer.html
parent59741cd535c47f25971bf8c32b25da25ceadc6d5 (diff)
downloadpostrunner-ea346a785dc1b3f7c156f6fc33da634e1f1a627b.zip
Adding jquery, flot and openlayers to be included with the GEM.v0.0.4
Diffstat (limited to 'misc/openlayers/examples/dynamic-text-layer.html')
-rw-r--r--misc/openlayers/examples/dynamic-text-layer.html101
1 files changed, 101 insertions, 0 deletions
diff --git a/misc/openlayers/examples/dynamic-text-layer.html b/misc/openlayers/examples/dynamic-text-layer.html
new file mode 100644
index 0000000..a361b73
--- /dev/null
+++ b/misc/openlayers/examples/dynamic-text-layer.html
@@ -0,0 +1,101 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+ <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">
+ <title>OpenLayers Vector Behavior Example</title>
+ <link rel="stylesheet" href="../theme/default/style.css" type="text/css">
+ <link rel="stylesheet" href="style.css" type="text/css">
+ <script src="../lib/OpenLayers.js"></script>
+ <script type="text/javascript">
+ var map;
+
+ function init(){
+ map = new OpenLayers.Map('map');
+ var wms = new OpenLayers.Layer.WMS(
+ "OpenLayers WMS", "http://vmap0.tiles.osgeo.org/wms/vmap0",
+ {layers: 'basic'}
+ );
+
+ var layer = new OpenLayers.Layer.Vector("POIs", {
+ strategies: [new OpenLayers.Strategy.BBOX({resFactor: 1.1})],
+ protocol: new OpenLayers.Protocol.HTTP({
+ url: "textfile.txt",
+ format: new OpenLayers.Format.Text()
+ })
+ });
+
+ map.addLayers([wms, layer]);
+ map.zoomToMaxExtent();
+
+ // Interaction; not needed for initial display.
+ selectControl = new OpenLayers.Control.SelectFeature(layer);
+ map.addControl(selectControl);
+ selectControl.activate();
+ layer.events.on({
+ 'featureselected': onFeatureSelect,
+ 'featureunselected': onFeatureUnselect
+ });
+ }
+
+
+ // Needed only for interaction, not for the display.
+ function onPopupClose(evt) {
+ // 'this' is the popup.
+ var feature = this.feature;
+ if (feature.layer) { // The feature is not destroyed
+ selectControl.unselect(feature);
+ } else { // After "moveend" or "refresh" events on POIs layer all
+ // features have been destroyed by the Strategy.BBOX
+ this.destroy();
+ }
+ }
+ function onFeatureSelect(evt) {
+ feature = evt.feature;
+ popup = new OpenLayers.Popup.FramedCloud("featurePopup",
+ feature.geometry.getBounds().getCenterLonLat(),
+ new OpenLayers.Size(100,100),
+ "<h2>"+feature.attributes.title + "</h2>" +
+ feature.attributes.description,
+ null, true, onPopupClose);
+ feature.popup = popup;
+ popup.feature = feature;
+ map.addPopup(popup, true);
+ }
+ function onFeatureUnselect(evt) {
+ feature = evt.feature;
+ if (feature.popup) {
+ popup.feature = null;
+ map.removePopup(feature.popup);
+ feature.popup.destroy();
+ feature.popup = null;
+ }
+ }
+ </script>
+ </head>
+ <body onload="init()">
+ <h1 id="title">Dynamic POIs via a Text Layer</h1>
+ <div id="tags">
+ poi, dynamic data, text, format, strategy, popup, select, selection
+ </div>
+ <p id="shortdesc">
+ Loading dynamic data from a text file.
+ </p>
+ <div id="map" class="smallmap"></div>
+ <div id="docs">
+ <p>The vector layer shown uses the BBOX strategy, the HTTP protocol,
+ and the Text format.
+ This setup appends "?bbox=west,south,east,north" to every
+ request. This allows you to configure the location as something
+ like 'textfile.php', and take the '?bbox=' parameter to select
+ data from a database or the like.</p>
+ <p>There is nothing about this example that limits it to text files;
+ you can do the same thing with KML, GeoJSON, etc.</p>
+ <p>This is an alternative to something like the <a href="http://wiki.openstreetmap.org/index.php/OpenLayers_Dynamic_POI">OpenStreetMap "Dynamic POI"</a> example. The Layer is a standard vector layer, and interaction can be
+ configured via the SelectFeature control, as you can see in the
+ latter half of the code, which allows you to open a popup when
+ a feature is selected.</p>
+ </div>
+ </body>
+</html>