j-Map

jComponent 20 · jcomponent@20 component Beispiel mit jComponent 20 geladen

path="target.property" kann GPS 48.727903,19.157763 oder Text Viestova 28, Banská Bystrica, Slovakia enthalten
Zwei Wege binden mit GPS (das Komponent kehrt die GPS-Koordinate in das Modell zurück, wenn der text statt GPS verwendet wird)
important: Das Komponentenelement (oder sein CSS) muss die width und height Stilattribut definiert haben

Konfiguration:

key IMPORTANT Google API-Schlüssel
type (optional) muss einen Kartentyp enthalten (roadmap (default), satellite, hybrid, terrain)
draggable (optional) für den Drag & Drop-Marker (Default: false)
click (optional) muss ein Funktionenname enthalten und diese Methode wird bewertet, wenn der Benutzer auf den Markierer klickt
zoom (optional), Standard 13
icon (optional) muss eine URL für einen neuen Icon markieren
animation (optional) muss eine Animationstype enthalten (bounce und drop)

Methoden:

component.search(lat, lng) Argumente müssen Zahlen sein
component.search(text) Argumente müssen ein String sein
component.reset() Call resize Event (nützlich für Modale)
component.reset(lat, lng) Argumente müssen Zahlen sein

Verwenden Sie es mit <ui-component name="map">. Wenn die Komponente noch nicht geladen ist, lädt jComponent sie bei der ersten Verwendung von der Adresse in DEF.fallback herunter (standardmäßig das CDN Componentator). Autor: Peter Širka. Quelle: Componentator-Komponenten-Repository, MIT-Lizenz.

example.html

<ui-component name="map" path="mygps" config="zoom:10;draggable:false;animation:bounce" style="width:300px;height:150px"></ui-component>

<script>
	var mygps = '48.727903,19.157763';
</script>