x

OpenLayers.js lokal ablegen?

Geschrieben von SCINET (Gast) am 28. April 2022 11:47:21: [flux]

Ihr Lieben,
erst einmal ein herzliches Hallo in die Runde - ich bin neu hier und versuche mich gerade an einer ersten Map, die schon ganz gut funktioniert.

Nun habe ich jedoch die Frage, ob ich die eingebundene OpenLayers.js auch lokal ablegen kann?

Ich habe das gerade getestet, mir die OpenLayers.js heruntergeladen und eingebunden und damit funktioniert die Karte zwar noch, macht aber die gewünschten Marker ohne Bild (vermutlich CSS), jedoch auch die richtige Positionierung etc. nicht mehr.

Ich habe also konkret die Frage:

Ist es möglich, die .js lokal abzulegen und wenn ja, welche Elemente braucht es dann zusätzlich zu der ObenLayers.js dafür?

Hier ist mein derzeitiger Code (PHP)

<?php
//␣Lat␣und␣Lon␣für␣die␣erste␣Geolocation␣setzen,␣später␣werden␣die␣geliefert
$geocode_lat="51.395909979619404";
$geocode_lon="9.754527694103915";

//␣Testweise␣hinterlegte␣Lat␣und␣Lon␣für␣die␣zweite␣Geolocation␣setzen,␣später␣werden␣die␣geliefert
$kd_geocode_lat="41.8933203";
$kd_geocode_lon="12.4829321";

//␣Wir␣berechnen␣das␣Zentrum␣der␣Karte
$center_lat=($geocode_lat␣+␣$kd_geocode_lat)/2;
$center_lon=($geocode_lon␣+␣$kd_geocode_lon)/2;
?>
<html>
<head>
<style>
.olmap␣{␣height:100%;␣width:100%;}
</style>
</head>
<body>
<div␣id="mapdiv"></div>
<script␣type="text/javascript"␣src="https://www.openlayers.org/api/OpenLayers.js"></script>

<script>
map␣=␣new␣OpenLayers.Map("mapdiv");
map.addLayer(new␣OpenLayers.Layer.OSM());

var␣lonLatCenter␣=␣new␣OpenLayers.LonLat(␣<?php␣Echo␣$center_lon;␣?>␣,<?php␣Echo␣$center_lat;␣?>␣)
.transform(
new␣OpenLayers.Projection("EPSG:4326"),␣//␣Transformation␣aus␣dem␣Koordinatensystem␣WGS␣1984
map.getProjectionObject()␣//␣in␣das␣Koordinatensystem␣'Spherical␣Mercator␣Projection'
);
var␣lonLatBase␣=␣new␣OpenLayers.LonLat(␣<?php␣Echo␣$geocode_lon;␣?>␣,<?php␣Echo␣$geocode_lat;␣?>␣)
.transform(
new␣OpenLayers.Projection("EPSG:4326"),␣//␣Transformation␣aus␣dem␣Koordinatensystem␣WGS␣1984
map.getProjectionObject()␣//␣in␣das␣Koordinatensystem␣'Spherical␣Mercator␣Projection'
);
var␣lonLatKd␣=␣new␣OpenLayers.LonLat(␣<?php␣Echo␣$kd_geocode_lon;␣?>␣,<?php␣Echo␣$kd_geocode_lat;␣?>␣)
.transform(
new␣OpenLayers.Projection("EPSG:4326"),␣//␣Transformation␣aus␣dem␣Koordinatensystem␣WGS␣1984
map.getProjectionObject()␣//␣in␣das␣Koordinatensystem␣'Spherical␣Mercator␣Projection'
);

var␣zoom=8;

var␣markers␣=␣new␣OpenLayers.Layer.Markers(␣"Markers"␣);
map.addLayer(markers);
markers.addMarker(new␣OpenLayers.Marker(lonLatBase));

markers.addMarker(new␣OpenLayers.Marker(lonLatKd));
var␣newBound␣=␣markers.getDataExtent();
map.zoomToExtent(newBound);

</script>
</body></html>

Vielen herzlichen Dank für jeden Hinweis

mit besten Grüßen
Rainer Strebel

Antworten: