-<html xmlns="http://www.w3.org/1999/xhtml">
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
+ <title>OpenStreetMap Embedded</title>
<style type="text/css">
+ html {
+ width: 100%;
+ height: 100%;
+ }
+ body {
+ width: 100%;
+ height: 100%;
+ margin: 0px;
+ }
#map {
width: 100%;
height: 100%;
}
.olControlAttribution {
- bottom: 3px!important;
- }
+ bottom: 3px!important;
+ }
</style>
- <script src="http://openstreetmap.org/openlayers/OpenLayers.js"></script>
- <script src="http://openstreetmap.org/openlayers/OpenStreetMap.js"></script>
+ <script src="http://openstreetmap.org/openlayers/OpenLayers.js" type="text/javascript"></script>
+ <script src="http://openstreetmap.org/openlayers/OpenStreetMap.js" type="text/javascript"></script>
<script type="text/javascript">
+ <!--
var map, layer;
- function localUpdateLink() {
- var center = this.map.getCenter();
-
- // Map not initialized yet. Break out of this function.
- if (!center) {
- return;
- }
-
- var params = OpenLayers.Util.getParameters(this.base);
-
- params.zoom = this.map.getZoom();
- var lat = center.lat;
- var lon = center.lon;
-
- if (this.displayProjection) {
- var mapPosition = OpenLayers.Projection.transform(
- { x: lon, y: lat },
- this.map.getProjectionObject(),
- this.displayProjection );
- lon = mapPosition.x;
- lat = mapPosition.y;
- }
-
- if (this.map.marker) {
- params.lat = Math.round(lat*100000)/100000;
- params.lon = Math.round(lon*100000)/100000;
- } else {
- params.mlat = Math.round(lat*100000)/100000;
- params.mlon = Math.round(lon*100000)/100000;
- }
-
- var href = this.base;
- if( href.indexOf('?') != -1 ){
- href = href.substring( 0, href.indexOf('?') );
- }
-
- href += '?' + OpenLayers.Util.getParameterString(params);
- this.element.href = href;
- }
-
function init(){
- OpenLayers.Lang.en.permalink = "Larger Map";
map = new OpenLayers.Map ("map", {
- controls:[
+ controls: [
new OpenLayers.Control.Attribution(),
- new OpenLayers.Control.ArgParser(),
- new OpenLayers.Control.Navigation(),
- new OpenLayers.Control.Permalink(null, "http://openstreetmap.org/", {updateLink:localUpdateLink})],
+ new OpenLayers.Control.Navigation()
+ ],
maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,
20037508.34,20037508.34),
- numZoomLevels:20,
- maxResolution:156543.0339,
+ numZoomLevels: 20,
+ maxResolution: 156543.0339,
displayProjection: new OpenLayers.Projection("EPSG:4326"),
- units:'m',
+ units: 'm',
projection: new OpenLayers.Projection("EPSG:900913")
- } );
- var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", {
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
});
- map.addLayer(mapnik);
- var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", {
- displayOutsideMaxExtent: true,
- wrapDateLine: true,
- attribution: '<a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>'
- });
- map.addLayer(osmarender);
+ var attribution = 'Data by <a target="_parent" href="http://www.openstreetmap.org">OpenStreetMap</a>';
var args = OpenLayers.Util.getParameters();
- if (args.marker && map.getCenter()) {
+ if (!args.layer || args.layer == "mapnik") {
+ var mapnik = new OpenLayers.Layer.OSM.Mapnik("Mapnik", {
+ displayOutsideMaxExtent: true,
+ wrapDateLine: true,
+ attribution: attribution
+ });
+ map.addLayer(mapnik);
+ } else if (args.layer == "osmarender") {
+ var osmarender = new OpenLayers.Layer.OSM.Osmarender("Osmarender", {
+ displayOutsideMaxExtent: true,
+ wrapDateLine: true,
+ attribution: attribution
+ });
+ map.addLayer(osmarender);
+ } else if (args.layer == "cycle map") {
+ var cyclemap = new OpenLayers.Layer.OSM.CycleMap("Cycle Map", {
+ displayOutsideMaxExtent: true,
+ wrapDateLine: true,
+ attribution: attribution
+ });
+ map.addLayer(cyclemap);
+ }
+
+ if (args.marker) {
var markers = new OpenLayers.Layer.Markers();
map.addLayer(markers);
- markers.addMarker( new OpenLayers.Marker(map.getCenter()));
+ markers.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(args.marker[1], args.marker[0]).transform(map.displayProjection, map.getProjectionObject())));
map.marker = true;
- }
- if (!map.getCenter()) { map.zoomToMaxExtent(); }
+ }
+
+ if (args.bbox) {
+ var bounds = OpenLayers.Bounds.fromArray(args.bbox).transform(map.displayProjection, map.getProjectionObject());
+ map.zoomToExtent(bounds)
+ } else {
+ map.zoomToMaxExtent();
+ }
+
var size = map.getSize();
- if (size.h > 320) {
+ if (size.h > 320) {
map.addControl(new OpenLayers.Control.PanZoomBar());
} else {
map.addControl(new OpenLayers.Control.PanZoom());
- }
+ }
}
+ // -->
</script>
</head>
+
<body onload="init()">
<div id="map"></div>
</body>
projects / rails.git / blobdiff