- Affected Version
- WoltLab Suite 5.3
Guten Abend,
ich hoffe es gibt jemanden der mir hier helfen kann oder will. Ich möchte eine selbst erstellte Karte in einer dafür erstellten Seite einfügen. Ich benutze dafür Leaflet. Ich habe es früher auch schon mit anderen Scripts versucht, das hat dann auch funktioniert. Leaflet schien mir aber mehr Möglichkeiten zu haben.
Jedenfalls funktioniert alles wenn ich eine html Datei in meinem Webspace anlege und diese dann aufrufe. Dort wird alles angezeigt wie es sein soll.
Wenn ich aber den Code in dem Inhaltsbereich der Forenseite (html) einfüge, dann passiert nichts. Der <div> in welchem die Karte dargestellt werden soll wird zwar dargestellt (transparent) aber er wird von dem Script nicht gefüttert.
Weiß jemand woran das liegen kann? Anbei der Code:
<!DOCTYPE html>
<html>
<head>
<title>CRS.Simple example - Leaflet</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" type="image/x-icon" href="docs/images/favicon.ico" />
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script>
<style>
html, body {
height: 100%;
margin: 0;
}
#map {
width: 600px;
height: 400px;
}
</style>
</head>
<body>
<div id='map'></div>
<script>
var map = L.map('map', {
crs: L.CRS.Simple,
minZoom: -3
});
var bounds = [[0,0], [6400,6400]];
var image = L.imageOverlay('Link_zur_Karte.png', bounds).addTo(map);
var sol = L.latLng([ 145, 175 ]);
L.marker(sol).addTo(map);
map.setView( [70, 120], 1);
</script>
</body>
</html>Ich habe jetzt die Möglichkeit gefunden das als iframe einzufügen, aber geht es nicht auch direkt?
