Einfache Polyline

Ghostrider82 · 2011-01-13 11:38:14

Hallöchen,

ich stehe gerade auf dem Schlauch, ist warscheinlich ein einfaches Problem.

Ich möchte eine simple Polyline auf die Karte projezieren:

layerMapnik = new OpenLayers.Layer.OSM.Mapnik(\"Mapnik\");
map.addLayer(layerMapnik);

layerTilesAtHome = new OpenLayers.Layer.OSM.Osmarender(\"Osmarender\");
map.addLayer(layerTilesAtHome);

layerCycleMap = new OpenLayers.Layer.OSM.CycleMap(\"CycleMap\");
map.addLayer(layerCycleMap);

layerMarkers = new OpenLayers.Layer.Markers(\"Markers\");
map.addLayer(layerMarkers);

var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection(\"EPSG:4326\"), map.getProjectionObject());
var lonLat2 = new OpenLayers.LonLat($ergebnis2, $ergebnis1).transform(new OpenLayers.Projection(\"EPSG:4326\"), map.getProjectionObject());

map.setCenter (lonLat2, zoom);

var size = new OpenLayers.Size(40,40);
var size2 = new OpenLayers.Size(35,35);

var offset = new OpenLayers.Pixel(-(size.w/2), -size.h/2);
var offset2 = new OpenLayers.Pixel(-(size2.w/2), -size2.h);
var icon4 = new OpenLayers.Icon('centerPoi.gif',size2,offset2);

var markers = new OpenLayers.Layer.Markers( \"Markers\");
var size = new OpenLayers.Size(20,20);
var offset = new OpenLayers.Pixel(-(size.w/2), -size.h); //Wichtig für extra Icon

layerMarkers.addMarker(new OpenLayers.Marker(lonLat2,icon4)); //notwendig

}
</script>

</head>
<body onload=\"init();\">

</body>
</html>

Leider wird die Polyline nicht angezeigt, weiss jemand, wo es hakt?

Danke im Voraus

Last edited by Ghostrider82 (2011-01-13 11:38:33)

ajoessen · 2011-01-13 12:00:03

Ghostrider82 wrote:

Leider wird die Polyline nicht angezeigt, weiss jemand, wo es hakt?
Danke im Voraus

Vielleicht sollte die polylinie innerhalb der init-Prozedur aufgerufen werden?

Gruß,
ajoessen

Ghostrider82 · 2011-01-13 12:05:43

Hatte ich auch schon gedacht, aber das war leider nicht des Rätsels Lösung.

wambacher · 2011-01-13 12:22:15

Ghostrider82 wrote:

Hatte ich auch schon gedacht, aber das war leider nicht des Rätsels Lösung.

alle ausführbare befehle müssen auch ausgeführt werden können, damit sie was bewirken - ganz logisch, oder???

z.b. map.addPolyline ... --> rein nach init()

bei variablen-definitionen ist das nicht unbedingt notwendig.

gruss
walter

p.s. da du anscheinend ganz frisch mit openlayers anfängst:
Layer.Marker und ähnliche Sachen sind absolut veraltet und werden von ol nicht weiter entwickelt.
du solltest dich mal mit Layer.Vector beschäftigen, da das alles "erschlägt".
Damit geht alles.

Last edited by wambacher (2011-01-13 12:28:36)

Ghostrider82 · 2011-01-13 12:46:29

Leider wird die Karte nicht mehr angezeigt, sobald map.addPolyline(...) im Initbereich steht, egal, an welcher Position.

Zum P.S.
Ich arbeite sehr selten mit OL, und wenn, dann nur wenn ich es brauche, und das ist eben selten der Fall.
Daher habe ich mich mit Weiterentwicklungen noch nie beschäftigt...

wambacher · 2011-01-13 12:52:38

Ghostrider82 wrote:

Leider wird die Karte nicht mehr angezeigt, sobald map.addPolyline(...) im Initbereich steht, egal, an welcher Position.

dann ist was falsch in deinem Programm!!!
Schau dir das Fehlerprotokoll im Firefox an, da steht dann alles drin. ( IE sollte auch sowas haben)

Und glaub mir bitte: es MUSS nach init.
Du bekommst deine Karte derzeit nur deswegen angezeigt (ohne poly), weil nicht alle Befehle ausgeführt werden.
Und was nicht ausgeführt wird, kann auch keinen Fehler verursachen.

Ghostrider82 · 2011-01-13 13:16:03

Meldung: Das Objekt unterstützt diese Eigenschaft oder Methode nicht.
Zeile: 42
Zeichen: 8
Code: 0
URI:

In besagter Zeile findet sich map.addPolyline(myPoly);

Ghostrider82 · 2011-01-13 18:51:41

Hat jemand ein Codebeispiel oder einen Link, wo ich was finde?
Mir würde es völlig reichen, wenn ich wüsste, wie ich eine einfache Linie auf die Karte lege.

Hobby Navigator · 2011-01-13 19:53:55

Eventuell hilft dir diese Seite weiter. Hier sind einige Beispiele aufgeführt.
Habe mir das Buch vor einige Zeit angeschafft und "studiere" es jetzt Stück für Stück..
Georg

maxbe · 2011-01-14 13:49:54

Wo hast Du denn dieses

var myPoly = new Polyline

her? Ich finde das nirgendas in der Doku (auch nicht als openlayers.Polyline oder so).

maxbe · 2011-01-15 14:00:52

Ghostrider82 wrote:

Hat jemand ein Codebeispiel oder einen Link, wo ich was finde?
Mir würde es völlig reichen, wenn ich wüsste, wie ich eine einfache Linie auf die Karte lege.

var proj1=new OpenLayers.Projection("EPSG:4326");
var proj2=new OpenLayers.Projection("EPSG:900913");

var style = { strokeColor: '#ff0000', strokeOpacity: 0.5,strokeWidth: 20};

var lineLayer = new OpenLayers.Layer.Vector("Striche");

var pointList = [];
pointList.push(new OpenLayers.Geometry.Point(3,  40).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(20, 45).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(3,  50).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(10, 55).transform(proj1,proj2));

var lineFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(pointList), null, style);
lineLayer.addFeatures([lineFeature]);
map.addLayers([lineLayer]);

zu Besichtigen hier.

Last edited by maxbe (2011-01-15 15:47:21)

Ghostrider82 · 2012-09-04 13:59:15

Hallo zusammen,

folgenden Code habe ich nochmals aufgegriffen, um mir Linien auf die Map zu plotten.

var proj1=new OpenLayers.Projection("EPSG:4326");
var proj2=new OpenLayers.Projection("EPSG:900913");

var style = { strokeColor: '#ff0000', strokeOpacity: 0.5,strokeWidth: 20};

var lineLayer = new OpenLayers.Layer.Vector("Striche");

var pointList = [];
pointList.push(new OpenLayers.Geometry.Point(3,  40).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(20, 45).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(3,  50).transform(proj1,proj2));
pointList.push(new OpenLayers.Geometry.Point(10, 55).transform(proj1,proj2));

var lineFeature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(pointList), null, style);
lineLayer.addFeatures([lineFeature]);
map.addLayers([lineLayer]);

Nun versuche ich, nicht nur eine Liste von Punkten mit einandern zu verbinden, sondern zwei Listen, alle Punkte aus Liste A zusammen, und alle Punkte aus Liste B zusammen.

Aktuell landen aber alle Punkte aus Liste A und B zusammen.

Mein Gedanke daher:

var lineLayer_1 = new OpenLayers.Layer.Vector("Striche1");
var lineLayer_2 = new OpenLayers.Layer.Vector("Striche2");

var pointList_1 = [];
var pointList_2 = [];

//Liste 1
pointList_1.push(new OpenLayers.Geometry.Point(a,b).transform(proj1,proj2));
pointList_1.push(new OpenLayers.Geometry.Point(a,b).transform(proj1,proj2));
pointList_1.push(new OpenLayers.Geometry.Point(a,b).transform(proj1,proj2));
pointList_1.push(new OpenLayers.Geometry.Point(a,b).transform(proj1,proj2));

//Liste 2
pointList_2.push(new OpenLayers.Geometry.Point(c,d).transform(proj1,proj2));
pointList_2.push(new OpenLayers.Geometry.Point(c,d).transform(proj1,proj2));
pointList_2.push(new OpenLayers.Geometry.Point(c,d).transform(proj1,proj2));
pointList_2.push(new OpenLayers.Geometry.Point(c,d).transform(proj1,proj2));

var lineFeature_1 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(pointList_1), null, style);
var lineFeature_2 = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.LineString(pointList_2), null, style);


lineLayer_1.addFeatures([lineFeature_1]);
lineLayer_2.addFeatures([lineFeature_2]);


map.addLayers([lineLayer_1]);
map.addLayers([lineLayer_2]);

Allerdings erhalten ich nun ein "Spinnennetz", d.h. die Punkte aus Liste A werden mit den Punkten aus Liste B verbunden usw.

Wo liegt hier mein Fehler?

Vielen Dank im Voraus,
Boris

maxbe · 2012-09-04 14:41:52

Doch, geht eigentlich schon so wie in Deinem unterem Codeteil (Beispiel). Kann das vielleicht an Deinen Koordinaten (a,b,c,d) liegen?

Ghostrider82 · 2012-09-04 16:11:32

Okay, sehe schon. Habe versehentlich an einer Stelle dem richtigen Feature die falsche Pointlist zugewiesen und dann nochmal die richtige, als kreuz und quer.

Aber ich habe an dieser Stelle gleich einmal eine andere Frage.

Die Koordinaten kommen aus einer DB. Diese hole ich per AJAX ab, das Script, welches die Daten abruft, wird im Intervall von 1 Minute aufgerufen (setInterval...).
Am Ende möchte ich gerne Wolken auf die Karte zaubern, die sich bewegen, diese Wolken ziehen eine Linie hinter sich her.

Klappt.

Aber: Je öfter die Schleife ausgeführt wird, desto langsamer wird die Karte, bis der Browser einfriert.

Kann / muss ich das Layer irgendwie zurücksetzen?
Ohne es jetzt getestet zu haben: Würde da ein layer.removeFeature weiterhelfen?

Last edited by Ghostrider82 (2012-09-04 16:12:15)

wambacher · 2012-09-04 17:15:47

Ghostrider82 wrote:

Je öfter die Schleife ausgeführt wird, desto langsamer wird die Karte, bis der Browser einfriert.

logisch. ab einigen hundert Objekten, die mit OL - also mit Javascript - dargestellt werden, MUSS es langsam werden. Da kommt der Browser einfach nicht mit.
Eine gängige Lösung ist das Clustern mit openlayers.strategy.cluster() , die du ja wegen Vectors als Layer gut verwenden kannst.

Gruss
walter

Last edited by wambacher (2012-09-04 17:19:17)

Ghostrider82 · 2012-09-06 09:25:54

Dann werde ich mich mal mit der Custerlösung befassen.

Bis dahin wäre mir aber sehr daran gelegen, eine Zwischenlösung zu integrieren.
Gibt es eine Möglichkeit, "alte" Punkte aus der Pointlist zu entfernen, diese alten Punkte von der Karte zu entfernen, damit es temporärer zu keiner Überlastung des Browsers kommt?

//Nachtrag:

Mein Gedanke:

1.) Array Pointlist generieren, z.B. 100 Datenpunkte
2.) Pointliste auf Karte plotten
3.) Features entfernen
4.) Neues Array Pointlist generieren
5.) Pointlist auf Karte plotten
etc.

Das Ganze als Schleife.

Oder muss ich dann das ganze Layer entfernen und wieder hinzufügen?

Last edited by Ghostrider82 (2012-09-06 09:29:13)

maxbe · 2012-09-06 10:41:23

Es reicht wenn Du auf dem Layer ein destroyFeatures() ausführst.

Bei 100 Datenpunkten wird es noch flüssig gehen, danach wird es zunehmend zäher und ruckeliger. Teste es am besten mit dem IE, der hat meiner Erfahrung nach die größten Schwierigkeiten beim Umgang mit grossen Punktlisten.

Das hier dreht sich jetzt schon eine halbe Stunde mit 2x150 Punkten ohne erkennbare Ausfälle, ist aber extrem schlampig programmiert, so mit fast nur globalen Variablen

Grüße, Max

wambacher · 2012-09-06 16:28:16

Ghostrider82 wrote:

Dann werde ich mich mal mit der Custerlösung befassen.

sorry, alles zurück. clustern wird dir hier doch nicht weiterhelfen; das ist eine Methode POI auf kleineren Zoomleveln zusammenzufassen, damit es nicht so viele Features gleichzeitig werden.
Leider hab ich noch keine konkrete Vorstellung, was du eigentlich vor hast. Daher liegt mein Vorschlag wohl etwas daneben.

du kannst Features, die du ja mit xxx.addFeatures hinzufügst einfach mit xxx.removeFeatures, xxx.removeAllFeatures oder auch mit xxx.destroyFeatures oder xxx.eraseFeatures loswerden.
Sieh einfach mal diese Liste: http://dev.openlayers.org/docs/files/Op … or-js.html
da stehen die alle hintereinander bei Functions.

Gruss
walter

Last edited by wambacher (2012-09-06 16:28:44)

Ghostrider82 · 2012-09-06 21:41:02

Leider hab ich noch keine konkrete Vorstellung, was du eigentlich vor hast.

Ich ziehe mir per AJAX Koordinaten aus einer Datenbank.
Diese sind immer unterschiedlich. Ich möchte diese mit Hilfe von Linien miteinander verbinden.

Die Funktion, die die Daten aus der DB holt lasse ich per setInterval() im 10 Sekunden Takt laufen.

Und genau daher rührt auch mein Problem.

Mit jedem "Durchlauf" legt er zwar Linie an Linie, so dass ein kleiner Track entsteht (genau so, wie ich mir das vorgestellt habe), aber:

Die Opazität der Linie liegt bei aktuell 0.1, also kaum sichtbar. Mit jedem Durchlauf wird diese dunkler, ich denke also, er legt alle bisher vorhandenen Linien übereinander, und das bei jedem Durchlauf erneut.

Mein Gedanke ist / war / ist daher, nach xx Durchläufen die Karte bzw. das LineLayer "auf 0 zu setzen", bisher habe ich mir mit location.reload() beholfen,
allerdings ist das eher quick and ziemlich dirty.

Eigentlich würde ich gerne erstmal wissen, warum er die Linien immer wieder über einander legt.
Mit destroy, erase usw. kann man dann zwar sicher die Folgen beheben, aber nicht die Ursache.

wambacher · 2012-09-06 22:02:29

Ghostrider82 wrote:

Mit destroy, erase usw. kann man dann zwar sicher die Folgen beheben, aber nicht die Ursache.

Doch, ganz genau das. Die "Ursache" ist map.addFeatures(..) und wenn du die Features nicht mehr haben willst, musst du sie halt rausnehmen. und dafür ist map.removeFeatures da.
Das ist kein Rumflicken sondern so von OL gewollt.

Gruss
walter

ikonor · 2012-09-06 22:14:25

Ghostrider82 wrote:

Gibt es eine Möglichkeit, "alte" Punkte aus der Pointlist zu entfernen, diese alten Punkte von der Karte zu entfernen, damit es temporärer zu keiner Überlastung des Browsers kommt?

Noch ein paar theoretische Ideen (nicht getestet):

regelmäßig simplify aufrufen, um überflüssige Punkte zu entfernen, siehe Simplify a LineString geometry Beispiel.
evtl. ist es einfacher, den Anfangs-/End-Punkt im Feature direkt hinzuzufügen/zu entfernen (macht aber vermutlich fürs Rendering keinen Unterschied):
vlayer.getFeatureBy...().geometry.addPoint / getVertices + removePoint und anschließend vermutlich vlayer.drawFeature
Der Canvas Renderer scheint etwas schneller bei vielen Features zu sein (benötigt HTML5 Browser!)
vage Idee: da der Canvas IMO ein Zeichenbereich ist, der normalerweise immer komplett gelöscht und neu gezeichnet wird, könnte man evtl. den Renderer manipulieren, so dass er nicht löscht, sondern die alten Linien stehen läßt. Damit könnte man immer nur das hinzugefügte Stück der Linie zeichnen. Beim Zoomen müsste man dann aber trotzdem die kompletten Linien neu zeichnen, beim Verschieben vermutlich nach einem gewissen Puffer auch.

Gruß,
Norbert

Announcement

#1 2011-01-13 11:38:14

Einfache Polyline

#2 2011-01-13 12:00:03

Re: Einfache Polyline

#3 2011-01-13 12:05:43

Re: Einfache Polyline

#4 2011-01-13 12:22:15

Re: Einfache Polyline

#5 2011-01-13 12:46:29

Re: Einfache Polyline

#6 2011-01-13 12:52:38

Re: Einfache Polyline

#7 2011-01-13 13:16:03

Re: Einfache Polyline

#8 2011-01-13 18:51:41

Re: Einfache Polyline

#9 2011-01-13 19:53:55

Re: Einfache Polyline

#10 2011-01-14 13:49:54

Re: Einfache Polyline

#11 2011-01-15 14:00:52

Re: Einfache Polyline

#12 2012-09-04 13:59:15

Re: Einfache Polyline

#13 2012-09-04 14:41:52

Re: Einfache Polyline

#14 2012-09-04 16:11:32

Re: Einfache Polyline

#15 2012-09-04 17:15:47

Re: Einfache Polyline

#16 2012-09-06 09:25:54

Re: Einfache Polyline

#17 2012-09-06 10:41:23

Re: Einfache Polyline

#18 2012-09-06 16:28:16

Re: Einfache Polyline

#19 2012-09-06 21:41:02

Re: Einfache Polyline

#20 2012-09-06 22:02:29

Re: Einfache Polyline

#21 2012-09-06 22:14:25

Re: Einfache Polyline

Board footer