public/export/embed.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <style type="text/css">
   4         #map {
   5             width: 100%;
   6             height: 100%;
   7         }
   8         .olControlAttribution {
   9             bottom: 3px!important;
  10         }
  11     </style>
  12     <script src="http://openstreetmap.org/openlayers/OpenLayers.js"></script>
  13     <script src="http://openstreetmap.org/openlayers/OpenStreetMap.js"></script>
  14     <script type="text/javascript">
  15         var map, layer;
  16         function localUpdateLink() {
  17             var center = this.map.getCenter();
  18
  19             // Map not initialized yet. Break out of this function.
  20             if (!center) {
  21                 return;
  22             }
  23
  24             var params = OpenLayers.Util.getParameters(this.base);
  25
  26             params.zoom = this.map.getZoom();
  27             var lat = center.lat;
  28             var lon = center.lon;
  29
  30             if (this.displayProjection) {
  31                 var mapPosition = OpenLayers.Projection.transform(
  32                   { x: lon, y: lat },
  33                   this.map.getProjectionObject(),
  34                   this.displayProjection );
  35                 lon = mapPosition.x;
  36                 lat = mapPosition.y;
  37             }
  38
  39             if (this.map.marker) {
  40                 params.lat = Math.round(lat*100000)/100000;
  41                 params.lon = Math.round(lon*100000)/100000;
  42             } else {
  43                 params.mlat = Math.round(lat*100000)/100000;
  44                 params.mlon = Math.round(lon*100000)/100000;
  45             }
  46
  47             var href = this.base;
  48             if( href.indexOf('?') != -1 ){
  49                 href = href.substring( 0, href.indexOf('?') );
  50             }
  51
  52             href += '?' + OpenLayers.Util.getParameterString(params);
  53             this.element.href = href;
  54         }
  55
  56         function init(){
  57             OpenLayers.Lang.en.permalink = "Larger Map";
  58             map = new OpenLayers.Map ("map", {
  59               controls:[
  60                   new OpenLayers.Control.Attribution(),
  61                   new OpenLayers.Control.ArgParser(),
  62                   new OpenLayers.Control.Navigation(),
  63                   new OpenLayers.Control.Permalink(null, "http://openstreetmap.org/", {updateLink:localUpdateLink})],
  64               maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,
  65                                                20037508.34,20037508.34),
  66               numZoomLevels:20,
  67               maxResolution:156543.0339,
  68               displayProjection: new OpenLayers.Projection("EPSG:4326"),
  69               units:'m',
  70               projection: new OpenLayers.Projection("EPSG:900913")
  71             } );
  72             var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", {
  73                displayOutsideMaxExtent: true,
  74                wrapDateLine: true,
  75                attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
  76             });
  77             map.addLayer(mapnik);
  78
  79             var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", {
  80                displayOutsideMaxExtent: true,
  81                wrapDateLine: true,
  82                attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
  83             });
  84             map.addLayer(osmarender);
  85             var args = OpenLayers.Util.getParameters();
  86             if (args.marker && map.getCenter()) {
  87                 var markers = new OpenLayers.Layer.Markers();
  88                 map.addLayer(markers);
  89                 markers.addMarker( new OpenLayers.Marker(map.getCenter()));
  90                 map.marker = true;
  91             }
  92             if (!map.getCenter()) { map.zoomToMaxExtent(); }
  93             var size = map.getSize();
  94             if (size.h > 320) {
  95                 map.addControl(new OpenLayers.Control.PanZoomBar());
  96             } else {
  97                 map.addControl(new OpenLayers.Control.PanZoom());
  98             }
  99         }
 100     </script>
 101   </head>
 102   <body onload="init()">
 103     <div id="map"></div>
 104   </body>
 105 </html>