Rendern unterbrechen
Stefan
- svg
Hallo!
Nachdem mir Google keine Antwort präsentieren konnte, hoffe ich nun auf euch:
Ich bin gerade dabei, Conway's Game of Life zu implementieren. Als Basis verwende ich dazu eine SVG-Grafik, auf der die einzelnen Zellen als Rechtecke mittels Skript eingefügt und wieder entfernt werden.
Meine Frage ist nun, ob es eine Möglichkeit gibt, das Rendern zu unterbrechen, die Änderungen durchzuführen, und dann erneut zu rendern.
Vielen Dank für euere Antworten und viele Grüße,
Stefan
Hi Stefan!
Meine Frage ist nun, ob es eine Möglichkeit gibt, das Rendern zu unterbrechen, die Änderungen durchzuführen, und dann erneut zu rendern.
Verstehe ich nicht.
Du berechnest doch das Bild und zeigst es dann an. Danach berechnest du das Bild neu und hast wieder die Möglichkeit es anzuzeigen. Wo willst du da was abbrechen?
MfG H☼psel
Hi Hopsel!
Ich füge pro Runde mehrmals (je nach dem wie viele Zellen neu geboren werden) über appendChild ein Rechteck in mein SVG ein.
Meiner Meinung nach, zeichnet der Browser das Bild nach jedem Einfügen neu.
Ablauf:
In meinem Fall würde es jedoch reichen, wenn das Bild nach jeder Runde neu gezeichnet wird.
Gewünschter Ablauf:
Ich hoffe, mein Problem wurde dadurch klarer.
Viele Grüße,
Stefan
Hi Stefan!
Ich hoffe, mein Problem wurde dadurch klarer.
Vor allem wurde mir jetzt klar, dass du Javascript benutzt.
Ehrlich gesagt habe ich wenig Ahnung von Javascript.
Allerdings habe ich Vorschläge, wie du das Spiel schneller hinbekommst und somit die Parallelität simulieren kannst.
Ich würde eine Tabelle erzeugen, die die benötigten Zeilen und Spalten hat. Jede Zelle ist quadratisch mit einer größe von 4-8 Pixel. Diesen Zellen kannst du nun eine Hintergrundfarbe (oder ein Hintergrundbild) geben.
Über ein bestimmtes Intervall (z. B. 500ms) kannst du nun deine Berechnungen durchführen und die Hintergrundfarbe entsprechend ändern.
Möchtest du immer noch mit SVG arbeiten möchtest, gäbe es noch eine andere Alternative. Allerdings weiß ich nicht, ob sie die benötigten Geschwindikeitsvorteile bringt. Der meiste Aufwand müsste in der Berechnung liegen, die bestimmt, ob ein Feld stirbt, erhalten bleibt oder weiterlebt. Wenn du diese Berechnung erst durchführst und danach über appendChild/removeChild die Elemente löschst/hinzufügst, sollte das ebenfalls nahezu parallel ablaufen.
Dafür brauchst du natürlich ein separates Array mit der entsprechenden Dimension. Auf diesem führst du die schweren[tm] Berechnungen durch.
Die folgenden Vergleiche, wo nun ein Element hinzugefügt werden muss und welche Elemente gelöscht werden, mit Lösch- und Einfügeoperationen sollten nicht sehr ins Gewicht fallen.
Wie geschrieben, sind das nur Ideen. Ich habe zu wenig Erfahrung damit, um dir eine konkrete Antwort geben zu können. Interessant ist die Fragestellung aber allemal. =)
MfG H☼psel
Du könntest für jede mögliche Kombination von "an- und ausgeschalteten" Kästchen eine Gruppe anlegen. ;)
Hallo!
Du meinst, ich erstelle außerhalb des DOM-Baumes ein <g>-Object und hänge dort meine Kästchen ein. Im Anschluss hänge ich dann die ganze Gruppe ein. Würde wohl zumindest das hinzufügen optimieren, das Löschen bleibt aber weiterhin. Außerdem müsste man dann eine Art garbage-collection machen, um die leeren Gruppen zu löschen.
Eventuell meinst du aber, dass ich für alle Kombinationen Gruppen vorfertige, was aber praktisch unmöglich ist. Die Welt ist 100x100 Felder groß, was insgesamt 10000 Felder ergibt. Dafür bräuchte es 2^10000 Gruppen.
Trotzdem danke für den Tipp. Ich werde jetzt mal versuchen, mit der visibility-Eigenschaft zu arbeiten. Eventuell ist es schneller, nur Attribute zu verändern als Elemente hinzufügen/entfernen.
Viele Grüße,
Stefan
Hi Stefan!
Ich verstehe immer noch nicht, warum es eine SVG-Grafik sein muss.
Außerdem würde ich mich freuen, wenn man dein Projekt später mal bewundern kann.
MfG H☼psel