Du bist nicht angemeldet. Der Zugriff auf einige Boards wurde daher deaktiviert.
Seiten: 1
#1 02. April 2019 08:07
- brandy
- Server-Pate
- Registriert: 05. Juni 2011
- Beiträge: 799
- Webseite
LISE: Google Maps einbauen / Checkbox-Group aufteilen
Hallo!
Ich hätte zwei Fragen zu LISE:
Ich würde gerne ein Feld anlegen in dem man die Koordinaten oder den Link (was am Besten funktioniert) für einen Standort auf Google Maps (OSM) eingeben kann.
Leider funktioniert das ja seitens Google ja nur mit einem iframe (bei OSM auch).
Jetzt wäre es cool den iframe-Link selbst zu erstellen, jedoch funktioniert das leider nicht.
Hat da jemand Erfahrung damit?
Und wie teile ich die Werte eine Checkbox-Group in der Anzeige auf. Es ist ja quasi ein Array mit den Werten, die ausgewählt wurden.
Ich möchte diese Werte in jeweils einem div ausgeben.
Wie teile ich das auf?
Vielen Dank!
Beitrag geändert von brandy (02. April 2019 09:35)
Offline
#2 16. April 2019 09:24
- brandy
- Server-Pate
- Registriert: 05. Juni 2011
- Beiträge: 799
- Webseite
Re: LISE: Google Maps einbauen / Checkbox-Group aufteilen
Hat noch keiner Google-Maps mit LISE verwendet?
Offline
#3 17. April 2019 08:06
- NaN
- Moderator
- Ort: Halle (Saale)
- Registriert: 09. November 2010
- Beiträge: 4.435
Re: LISE: Google Maps einbauen / Checkbox-Group aufteilen
Das Problem ist nicht LISE, das Problem ist, dass Dein Vorhaben bei Google nicht ohne Google Maps Api Key funktioniert.
Man kann nicht einfach einen Link zu einer Google-Map selber zusammenbasteln und das dann via iFrame einbetten.
D.h. man könnte schon, aber dann hat man eben das vollständige Google-Maps inklusive aller Google-Menüs im iFrame und nicht nur den Kartenausschnitt.
Bei OSM braucht man zwar nicht unbedingt einen Key, aber am Ende läuft es bei beiden darauf hinaus, dass man die Map nicht vie iFrame einfach einbettet, sondern via Javascript generiert. (Google Maps API - kann angeblich sogar auch OSM Maps anzeigen; oder z.B. OpenLayers)
Vielleicht erinnerst Du Dich ja an dieses Thema hier
Da kam doch auch OpenLayers und OSM zum Einsatz.
Ich hatte hier ein Beispiel: http://jsfiddle.net/KWX47/
Dieser Teil dürfte für Dich relevant sein:
map = new OpenLayers.Map("ID DES DIVS WO DIE MAP REIN SOLL");
var mapnik = new OpenLayers.Layer.OSM();
map.addLayer(mapnik);
var clonlat = new OpenLayers.LonLat([LÄNGENGRAD], [BREITENGRAD]).transform( new OpenLayers.Projection("EPSG:4326"), new OpenLayers.Projection("EPSG:900913") );
var zoom = 12;
map.setCenter(clonlat, zoom);
Bei [LÄNGENGRAD] und [BREITENGRAD] müssen dann die Inhalte aus den Feldern von LISE rein.
Das wäre die meiner Meinung nach einfachste Variante.
Wenn Du es komfortabler haben willst, also z.B. mit Addresse, wirst Du um einen entsprechenden Geocoding-Dienst nicht herumkommen. D.h. Längen und Breitengrad musst Du erst mit einer gesonderten Anfrage aus der Addresse ermitteln. Z.B: nominatim.openstreetmap.org
Hier mal ein Beispiel (nutzt jQuery um die Koordinaten zu ermitteln):
http://jsfiddle.net/vxzgy9aw/1/
Empfehlen kann ich auch noch dieses Beispiel hier:
https://jsfiddle.net/jonataswalker/c4qv9afb/
Beitrag geändert von NaN (17. April 2019 09:11)
Module: GBFilePicker, AdvancedContent
Sicherheit: Beispiel .htaccess-Datei
CMSms 1.12 unter PHP 7:
cmsms-1.12.3.zip (inoffiziell - komplett inkl. Installer)
CMSms 1.12 unter PHP 8:
cmsms-1.12.4.zip (inoffiziell - komplett inkl. Installer)
Offline
#4 17. April 2019 08:08
- brandy
- Server-Pate
- Registriert: 05. Juni 2011
- Beiträge: 799
- Webseite
Re: LISE: Google Maps einbauen / Checkbox-Group aufteilen
Ah, okay!
Vielen Dank, die Antwort hat mir schon mal gewaltig weitergeholfen!
Offline
#5 20. April 2019 22:53
- Janl
- Server-Pate
- Ort: Freistadt, Österreich
- Registriert: 13. Dezember 2010
- Beiträge: 1.227
- Webseite
Re: LISE: Google Maps einbauen / Checkbox-Group aufteilen
Bei mir gibt es kein iFrame.
im Template:
[== de ==]
html
{* untere ist fuer osm ********************************************}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css"
integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ=="
crossorigin=""/>
{*---------- *}
<!-- Make sure you put this AFTER Leaflet's CSS -->
<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js"
integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log=="
crossorigin=""></script>
{* ende der osmkode ************************}
</head>
<body onload="drawmap();">
Dann ein Contentblock mit dem Plan:
[== de ==]
html
<div id='mapid' style='width:95%;height:400px;'></div>
{literal}
<script type="text/javascript">// <![CDATA[
var mymap = L.map('mapid').setView([50.00001, 15.00001], 15);
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 18,
attribution: 'Map data © <a href="https://openstreetmap.org">OpenStreetMap</a> contributors, ' +
'<a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
'Imagery © <a href="https://mapbox.com">Mapbox</a>',
id: 'mapbox.streets'
}).addTo(mymap);
L.marker([50.00001, 15.00001]).addTo(mymap)
.bindPopup("<b>Name,<br />Adresse<br />Wohnort</b>").openPopup();
var popup = L.popup();
function onMapClick(e) {
popup
.setLatLng(e.latlng)
.setContent("You clicked the map at " + e.latlng.toString())
.openOn(mymap);
}
mymap.on('click', onMapClick);
// ]]></script>
{/literal}
evt. eine eigene "access-token" holen.
Viel Spaß
Jan
Beitrag geändert von Janl (21. April 2019 23:11)
Ubuntu 16.04 KDE - Kubuntu 18.04 / win10 (1 duo-boot laptop)- LAMP
Raspi 4b mit Ubuntu 20.04 (64bit) und Mate.
Offline
#6 20. April 2019 21:39
- brandy
- Server-Pate
- Registriert: 05. Juni 2011
- Beiträge: 799
- Webseite
Re: LISE: Google Maps einbauen / Checkbox-Group aufteilen
Gut, und ich könnte den Linkteil mit mit einem Textfeld einsetzbar machen, da ich diesen dynamisch laden möchte.
Offline
Seiten: 1