OCAD Internet Map Scripting: Unterschied zwischen den Versionen
JBO (Diskussion | Beiträge) K (JBO verschob Seite OCAD Internet Map scripting nach OCAD Internet Map Scripting) |
JBO (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 1: | Zeile 1: | ||
OCAD Internet Map | Eine OCAD Internet Map kann benutzerdefiniert mit JavaScript gescriptet werden. | ||
==Ebenen zeigen und verbergen== | ==Ebenen zeigen und verbergen== | ||
Ebenen können mit dem Ebenenbefehl setVisibility angezeigt oder verborgen werden. Alle Ebenen werden in der Reihenfolge, in der sie im Array _poiLayers aufgelistet sind, exportiert. | |||
Beispiel: | |||
<pre> | <pre> | ||
function ShowLayer() { | function ShowLayer() { | ||
Zeile 14: | Zeile 14: | ||
} | } | ||
</pre> | </pre> | ||
Die Javascript-Funktionen können mit einem externen Link von der gleichen Seite aufgerufen werden. | |||
=Zu einem bestimmten Punkt springen= | =Zu einem bestimmten Punkt springen= | ||
Um zu einem bestimmten Standort auf der Karte zu springen, kann die folgende Funktion aufgerufen werden. | |||
<pre> | <pre> | ||
function JupToPointOfInterest() { | function JupToPointOfInterest() { | ||
Zeile 25: | Zeile 25: | ||
} | } | ||
</pre> | </pre> | ||
Die Variable map.numZoomLevels muss immer um eins verringert werden, um das maximale Zoomlevel zu erreichen. | |||
=Zusätzliche Vektorpunkte für Standorte hinzufügen= | =Zusätzliche Vektorpunkte für Standorte hinzufügen= | ||
Um zusätzliche Vektorpunkte für Standorte hinzuzufügen, können Sie folgende Funktion aufrufen: | |||
<pre> | <pre> | ||
function ShowPointOfInterest() { | function ShowPointOfInterest() { | ||
Zeile 40: | Zeile 41: | ||
} | } | ||
</pre> | </pre> | ||
Dafür muss eine zusätzliche Ebene im init script mit den folgenden Linien erstellt werden: | |||
<pre> | <pre> | ||
Zeile 47: | Zeile 48: | ||
</pre> | </pre> | ||
Die zwei Zeilen müssen zwischen den Befehlen "addControl" und "XMLInitPois" platziert werden. | |||
Für die Handhabung mit Vektoren, können die Optionen in der Dokumentation für OpenLayers aufgerufen werden: [[http://dev.openlayers.org/apidocs/files/OpenLayers/Feature/Vector-js.html#OpenLayers.Feature.Vector.style style options]] | |||
=Standorte mit drop down list zentrieren= | =Standorte mit drop down list zentrieren= | ||
Um einen Standort mit einer select-Liste zu zentrieren, können Sie den folgenden Code ausführen: | |||
<pre> | <pre> | ||
function JupToPoint(coords) { | function JupToPoint(coords) { | ||
Zeile 65: | Zeile 66: | ||
</pre> | </pre> | ||
In | In der HTML-Datei kann der Code folgendermassen aussehen: | ||
<pre> | <pre> | ||
<select id= "dropdown-select" onchange="JupToPoint(this.value);"> | <select id= "dropdown-select" onchange="JupToPoint(this.value);"> |
Version vom 16. August 2013, 10:15 Uhr
Eine OCAD Internet Map kann benutzerdefiniert mit JavaScript gescriptet werden.
Ebenen zeigen und verbergen
Ebenen können mit dem Ebenenbefehl setVisibility angezeigt oder verborgen werden. Alle Ebenen werden in der Reihenfolge, in der sie im Array _poiLayers aufgelistet sind, exportiert.
Beispiel:
function ShowLayer() { _poiLayers[0].setVisibility(true); } function HideLayer() { _poiLayers[0].setVisibility(false); }
Die Javascript-Funktionen können mit einem externen Link von der gleichen Seite aufgerufen werden.
Zu einem bestimmten Punkt springen
Um zu einem bestimmten Standort auf der Karte zu springen, kann die folgende Funktion aufgerufen werden.
function JupToPointOfInterest() { var point = new OpenLayers.LonLat(136733, 6667650); map.zoomTo(map.numZoomLevels-1); map.panTo(point); }
Die Variable map.numZoomLevels muss immer um eins verringert werden, um das maximale Zoomlevel zu erreichen.
Zusätzliche Vektorpunkte für Standorte hinzufügen
Um zusätzliche Vektorpunkte für Standorte hinzuzufügen, können Sie folgende Funktion aufrufen:
function ShowPointOfInterest() { var point1 = new OpenLayers.Geometry.Point(149667,6680327); var point2 = new OpenLayers.Geometry.Point(150386,6678682); var feature_point = new OpenLayers.Feature.Vector(point1, {},{fillOpacity : 0.4, pointRadius: 45, fillColor: "#ff0000" }); var feature_point2 = new OpenLayers.Feature.Vector(point2, {},{pointRadius: 15, fillColor: "#ff0000"}); highlight_layer.addFeatures([feature_point, feature_point2]); }
Dafür muss eine zusätzliche Ebene im init script mit den folgenden Linien erstellt werden:
highlight_layer = new OpenLayers.Layer.Vector('Highlight Layer'); map.addLayer(highlight_layer);
Die zwei Zeilen müssen zwischen den Befehlen "addControl" und "XMLInitPois" platziert werden.
Für die Handhabung mit Vektoren, können die Optionen in der Dokumentation für OpenLayers aufgerufen werden: [style options]
Standorte mit drop down list zentrieren
Um einen Standort mit einer select-Liste zu zentrieren, können Sie den folgenden Code ausführen:
function JupToPoint(coords) { if (value = null) { exit; } var cord = coords.split(","); var point1 = new OpenLayers.LonLat(cord[0],cord[1]); map.zoomTo(map.numZoomLevels-1); map.panTo(point1); }
In der HTML-Datei kann der Code folgendermassen aussehen:
<select id= "dropdown-select" onchange="JupToPoint(this.value);"> <option value="null">Select</option> <option value="134314,6668774">Location 1</option> <option value="149659,6679976">Location 2</option> <option value="140800,6668437">Location 3</option> </select>