--- step-12/index.html 2023-07-02 15:20:09.119154723 +0200
+++ step-13/index.html 2023-07-02 15:20:09.119154723 +0200
@@ -1,6 +1,6 @@
<html>
<head>
- <title>Step 12: geometry layer</title>
+ <title>Step 13: geometry from external source</title>
<script src="../OpenLayers.js"></script>
<script src="../OpenStreetMap.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
@@ -35,7 +35,7 @@
function init() {
lat = 52.025;
lon = 8.515;
- zoom = 15;
+ zoom = 14;
projLonLat = new OpenLayers.Projection("EPSG:4326"); // WGS 1984
projMercator = new OpenLayers.Projection("EPSG:900913"); // Spherical Mercator
@@ -71,18 +71,17 @@
map.setCenter(new OpenLayers.LonLat(lon, lat).transform(projLonLat,projMercator), zoom);
overviewMap.maximizeControl();
- var layerGeometry = new OpenLayers.Layer.Vector("Gebiete",{projection: projMercator});
+ var layerGeometry =
+ new OpenLayers.Layer.Vector("Gebiete", {
+ strategies: [new OpenLayers.Strategy.Fixed()],
+ protocol: new OpenLayers.Protocol.HTTP({
+ url: "geom.json",
+ format: new OpenLayers.Format.GeoJSON()
+ }),
+ projection: projMercator
+ });
map.addLayer(layerGeometry);
- var json_data = '{"type":"Polygon","coordinates":[[[946997.668901750002988,6804851.635990919545293],[947398.27435326797422,6805510.242152039892972],[947937.327855485025793,6806519.116099460050464],[947876.502885716035962,6806705.792200200259686],[948839.171578197972849,6807214.812279700301588],[948866.945791151025333,6806943.305583120323718],[948825.81323930202052,6806740.500387510284781],[948825.679655913030729,6806649.948161319829524],[948920.913480286952108,6806218.210386379621923],[949167.475020444951952,6805973.516733709722757],[949428.474698559031822,6805492.619279350154102],[949490.268147898023017,6805254.51523463986814],[949368.818583442945965,6804879.135642670094967],[949300.679923127987422,6804730.331076799891889],[949117.704076112015173,6804232.10446386039257],[948833.071270102052949,6803457.073904880322516],[948178.668511525029317,6803987.724127359688282],[947673.177835781942122,6804222.643158700317144],[946997.668901750002988,6804851.635990919545293]]]}';
-
- var geojson_format = new OpenLayers.Format.GeoJSON();
- var geometry = geojson_format.read(json_data, 'Geometry');
- var vector = new OpenLayers.Feature.Vector(geometry);
- layerGeometry.addFeatures(vector);
-
- map.zoomToExtent(layerGeometry.getDataExtent());
-
markers = new OpenLayers.Layer.Markers("Markers");
map.addLayer(markers);
@@ -110,6 +109,8 @@
};
marker.events.register("mousedown", feature, markerClick);
markers.addMarker(marker);
+
+ map.setCenter(new OpenLayers.LonLat(lon, lat).transform(projLonLat,projMercator), zoom);
}
</script>
</head>