OCAD Internet Map Scripting: Unterschied zwischen den Versionen

Aus OCAD 11 Wiki - Deutsch
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
OCAD Internet Map can be custom scripted with addition JavaScript code.
Eine OCAD Internet Map kann benutzerdefiniert mit JavaScript gescriptet werden.


==Ebenen zeigen und verbergen==
==Ebenen zeigen und verbergen==
Layers can be shown or hidden with the layer command setVisibility. All Layers are expored in the order they are shown in the _poiLayers array.
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.


Example:
Beispiel:
<pre>
<pre>
function ShowLayer() {
function ShowLayer() {
Zeile 14: Zeile 14:
}
}
</pre>
</pre>
The Javascript functions can be called with an external link from the same page.
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=
In order to go to a certain location on the map the following function can be called.
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>
The variable map.numZoomLevels must always be decreased by one in order to get the maximum zoom level.
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=
In order to achieve additional vector points this can be done with
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>
Therefore an additional layer must be introduced in the init script with the following lines:
Dafür muss eine zusätzliche Ebene im init script mit den folgenden Linien erstellt werden:


<pre>
<pre>
Zeile 47: Zeile 48:
</pre>
</pre>


The two lines must be placed between the "addControl" commands and "XMLInitPois" command.
Die zwei Zeilen müssen zwischen den Befehlen "addControl" und "XMLInitPois" platziert werden.


For the vector styling the options can be seen in the OpenLayers documentation: [[http://dev.openlayers.org/apidocs/files/OpenLayers/Feature/Vector-js.html#OpenLayers.Feature.Vector.style style options]]
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=
To center a location with a select list the following code can be introduced:
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 the HTML file the code can look like as follows:
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>
Abgerufen von „http://ocad.com/wiki/ocad11/de/index.php?title=OCAD_Internet_Map_Scripting&oldid=7855“