summaryrefslogtreecommitdiff
path: root/misc/openlayers/examples/markers.html
diff options
context:
space:
mode:
Diffstat (limited to 'misc/openlayers/examples/markers.html')
-rw-r--r--misc/openlayers/examples/markers.html59
1 files changed, 59 insertions, 0 deletions
diff --git a/misc/openlayers/examples/markers.html b/misc/openlayers/examples/markers.html
new file mode 100644
index 0000000..7d9552f
--- /dev/null
+++ b/misc/openlayers/examples/markers.html
@@ -0,0 +1,59 @@
+<!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>Markers Layer 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, layer;
+
+ function init(){
+ OpenLayers.ProxyHost="/proxy/?url=";
+ map = new OpenLayers.Map('map');
+ layer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
+ "http://vmap0.tiles.osgeo.org/wms/vmap0", {layers: 'basic'} );
+
+ map.addLayer(layer);
+ map.setCenter(new OpenLayers.LonLat(0, 0), 0);
+
+ var newl = new OpenLayers.Layer.Text( "text", { location:"./textfile.txt"} );
+ map.addLayer(newl);
+
+ var markers = new OpenLayers.Layer.Markers( "Markers" );
+ map.addLayer(markers);
+
+ var size = new OpenLayers.Size(21,25);
+ var offset = new OpenLayers.Pixel(-(size.w/2), -size.h);
+ var icon = new OpenLayers.Icon('http://www.openlayers.org/dev/img/marker.png',size,offset);
+ markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,0),icon));
+
+ var halfIcon = icon.clone();
+ markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(0,45),halfIcon));
+
+ marker = new OpenLayers.Marker(new OpenLayers.LonLat(90,10),icon.clone());
+ marker.setOpacity(0.2);
+ marker.events.register('mousedown', marker, function(evt) { alert(this.icon.url); OpenLayers.Event.stop(evt); });
+ markers.addMarker(marker);
+ map.addControl(new OpenLayers.Control.LayerSwitcher());
+ map.zoomToMaxExtent();
+
+ halfIcon.setOpacity(0.5);
+ }
+ </script>
+ </head>
+ <body onload="init()">
+ <h1 id="title">Markers Layer Example</h1>
+ <div id="tags">Marker, event, mousedown, popup, inco</div>
+ <div id="shortdesc">Show markers layer with different markers</div>
+ <div id="map" class="smallmap"></div>
+ <div id="docs">
+ <p>This is an example of an OpenLayers.Layers.Markers layer that shows
+ some examples of adding markers. Also demonstrated is registering a
+ mousedown effect on a marker.</p>
+ </div>
+ </body>
+</html>