Einbindung von OSM in Websites / Markierung von Bereichen mit Rahmen

Marcus Weidner Marcus.Weidner at lwl.org
Sa Jan 31 14:46:17 CET 2009


Hallo Jan-Benedict, hallo Liste,

es sind viele böhmische Dörfer dabei, aber ich habe mich versucht, da
ich bei osm bleiben möchte, mit open layer eine osm-Karte der Region
einzubinden. Das ist bis jetzt dabei rausgekommen:

---------
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Test</title>
</head>		
<body>
		
<div id="map" style="width:600px; height:500px;">
<script type="text/javascript"
src="http://openlayers.org/api/OpenLayers.js"></script>
<script type="text/javascript"
src="http://openstreetmap.org/openlayers/OpenStreetMap.js">
</script>

<script type="text/javascript">
  function Lon2Merc(lon) {
    return 20037508.34*lon/180;
  }
 
  function Lat2Merc(lat) {
    var PI = 3.14159265358979323846;
    lat = Math.log(Math.tan((90 + lat)*PI/360))/(PI/180);
    return 20037508.34*lat/180;
  }
</script>

<script type="text/javascript">
  var lon = 9.0;
  var lat = 52.0;
  var zoom = 11;
  var map = new OpenLayers.Map("map", {
  controls: [
                       new OpenLayers.Control.PanZoomBar(),
 	       new OpenLayers.Control.MouseToolbar(),
                        new
OpenLayers.Control.LayerSwitcher({'ascending':false}),
                        new OpenLayers.Control.Permalink(),
                        new OpenLayers.Control.ScaleLine(),
                        new OpenLayers.Control.Permalink('permalink'),
                        new OpenLayers.Control.MousePosition(),
                        new OpenLayers.Control.OverviewMap(), 
	       new OpenLayers.Control.MouseDefaults(),
                        new OpenLayers.Control.KeyboardDefaults()],

	maxExtent:
    new OpenLayers.Bounds(-20037508.34, -20037508.34, 20037508.34,
20037508.34),
    numZoomLevels: 18,
    maxResolution: 156543,
    units: 'meters',
    projection: "EPSG:41001"} );
 
	var mapnik_layer = new OpenLayers.Layer.OSM.Mapnik("Mapnik");
	var tah_layer = new
OpenLayers.Layer.OSM.Osmarender("Osmarender");
  
	map.addLayers([mapnik_layer, tah_layer]);
	
	var x = Lon2Merc(lon);
	var y = Lat2Merc(lat);
	map.setCenter(new OpenLayers.LonLat(x, y), zoom);
   </script>
</body>
</html>
---------

Und jetzt habe ich versucht, als Nicht-Javascripter, Beispiele von
openlayers zu adaptieren, z. B. setextent von der Seite (schöner wäre
der halbtransparente Rahmen bei boxes, aber das sah noch komplizierter
aus ;-)

--------
<html>
<head>
<title>Setting a visual Extent</title>
<link rel="stylesheet" href="../theme/default/style.css"
type="text/css" />
    <link rel="stylesheet" href="style.css" type="text/css" />
<script src="../OpenLayers.js"></script>
</head>
<body>
<h1 id="title">Setting a Visual Extent</h1>
<p id='shortdesc'>
  Use a boxes layer to visually display the area of interest indicated
by a user.
</p>

<p>
  Because the ability to set the map to a given extent is limited by
the 
  current resolutions available, zoomToExtent will not always set the
map to 
  exactly the right extent. In order to visually annotate the actual
extent, 
  this example, will use the Boxes layer to visually describe the
desired
  extent as well as setting the map extent.
</p>
  <div style="width:100%; height:75%" id="map"></div>
  <script defer="defer" type="text/javascript">
    var map = new OpenLayers.Map('map');
    var bounds = new OpenLayers.Bounds(-45,-45, 0, 45); 
    var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS", 
        "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} );
    map.addLayer(wms);
    map.zoomToExtent(bounds);
    var boxes = new OpenLayers.Layer.Boxes("boxes");
    var box = new OpenLayers.Marker.Box(bounds);
    boxes.addMarker(box);
    map.addLayer(boxes);
  </script>
</body>
</html>

--------

Wenn ich nun, sagen wir mal, einen rechteckigen Rahmen auf die Karte
setzen möchte, linke obere Ecke bei Dörentrup und rechte untere Ecke bei
Barntrup, und vielleicht noch einige andere, z. T. sich überlappende
Rahmen, dann hat das mit meinem Kenntnisstand nicht geklappt. Mir gelang
es nicht, die box/boxes einzubinden, auch die Definition des Rahmens
habe ich nicht verstanden. Vielleicht hast Du ja einen Hinweis, wie ich
meine Rahmen auf die Karten bekommen und diesen (als Schmankerl) mit
einer URL verbinde...

Die Koordinaten für die Rahmen liegen vor, dies ist also nicht der
Punkt. Ich hatte als "Anwender" gar nicht gedacht, was da auf mich
zukommt... Insgesamt ist aber ein mächtiges Werkzeug!

Dank und Gruß zum Wochende
Marcus




More information about the OSM mailing list