Unter Opera ist WebGL noch sehr buggy und per Standard deaktiviert.
Man kann es unter Opera:config -> User Prefs -> Enable WebGL aktivieren, wenn man den Wert auf 1 setzt.
Allerdings bleibt selbst dann der WebGL-Bereich leer.
Unter Opera ist WebGL noch sehr buggy und per Standard deaktiviert.
Man kann es unter Opera:config -> User Prefs -> Enable WebGL aktivieren, wenn man den Wert auf 1 setzt.
Allerdings bleibt selbst dann der WebGL-Bereich leer.
So, dann präsentiere ich mein Programm:
Es ist ein Editor, mit einer Demo-Funktion und SVG-Export geworden. Geschrieben mit Java 7.
Die Grafik auf der Oberfläche wird mittels JOGL erzeugt. Die JOGL-Binaries sind sehr groß, deswegen sind die jar-Dateien und recht groß.
Ich habe hierbei auf die Erweiterbarkeit und auf die Trennung von Model-View-Controller geachtet, was aber wohl an einigen Stellen mehr oder weniger gelungen ist.
Es ist also möglich, weitere Operationen hinzuzufügen. Jede Operation wurde in seiner eigenen Klasse implementiert. Es sind aber bis jetzt nur die Implementiert, die auch für den Contest vorgegeben sind.
Des weiteren gibt es eine zentrale Klasse, die alle relevanten Informationen besitzt und verwaltet.
Diese zentrale Klasse gibt den Renderern die benötigten Informationen und gibt denen bescheid, wann sie Rendern sollen.
Es ist also möglich unterschiedlichste Renderer zu implementieren. In meinem Programm habe ich zwei Entwickelt: Ein OpenGL-Renderer (GUI) und einen SVG-Renderer (SVG Export).
Außerdem können zusätzlich Listener registriert werden, die auf die Änderungen der Status-Werte reagieren. In meinem Fall sind es z.B. die Text-Ausgaben der Werte auf der GUI.
Statusänderungen, die zu einen Fehler führen, wie z.B. das Setzen eines Wertes auf 0, führen zu einer entsprechenden Exception, sodass der Entwickler jeweils auf die unterschiedlichen Exceptions reagieren kann.
Ebenfalls führt das poppen (yeah!) zu einer Exception, wenn der Stack leer ist.
Es gibt eine Demo-Klasse, die ein Fraktal erstellt. Das Fraktal wird über den Button "Demo ausführen" generiert.
Über die SVG-Export-Funktion wird das gezeichnete Bild in ein SVG-Bild gespeichert.
Das Fenster ist auf 800x600 eingestellt, aber es lässt sich beliebig skalieren.
So, viel spaß mit dem Editor.
Ich hoffe es läuft alles so weit. Mac OS X kann ich leider nicht testen, da ich kein OS X zur Hand habe.
Wäre schön, wenn noch jemand bescheid sagen könnte, ob es läuft, oder nicht.
Geändert von Whiz-zarD (24.03.2013 um 09:36 Uhr)
Die Linuxversion läuft bei mir unter Archlinux 64bit einwandfrei.Zitat von Whiz-zarD
Sehr interessanter Wettbewerb... Ich hatte mit Fraktalen bis dato noch nichts zu tun, aber nach ein wenig Einlesen interessiert mich das Thema schon etwas...
Dann mach mit, du hast noch fast eine ganze Woche Zeit.
--
Na dann, hier meine Endabgabe:
Zur online Version:
Pflanze
Koch Island
Dragon Curve
Kreis
Windung
Sourcecode
Screenshot:
Mittels mousedrag kann das L-System jetzt auch gedreht werden.
Alle generierten L-Systeme werden auf dieselbe größe skaliert.
Umgesetzt mit Javascript / Three.js / WebGL
Der hauptsächlich relevante Code befindet sich in page.js und in src/turtle.js.
Bei mir unter Windows7 läufts!
Geändert von nudelsalat (03.04.2013 um 08:20 Uhr)
Sehr schön. Danke
Wie uns gerade zugetragen wurde, haben einige von euch vergessen, ihren Sourcecode mit in den Osterurlaub zu nehmen, damit sie ihn rechtzeitig bis Sonntag abgeben koennen.
Aus diesem Grunde haben Jeez, DFYX und ich uns beratschlagt, und entschieden, den Contest um eine Woche bis Sonntag, den 7. April zu verlaengern.
Ihr habt also noch eine kleine Galgenfrist, eueren Code etwas aufzuhybschen oder noch ein paar tolle Bilderchen zu generieren.
Viel Spass dabei und Frohe Ostern.
--
So, hier kommt mein Beitrag. Ich habe nichts Aufregendes – nur eine kleine Webapp, die SVGs zeichnen kann. Ist nicht mal besonders hübsch geworden.
Ich habe ein paar Syntaxerweiterungen drin (siehe README) und kann gefüllte Flächen sowie Bézierkurven zeichnen. Im Wesentlichen benutzt meine App eine Billigversion von SVG als interne Repräsentation der Zeichnung, von daher sind die Features relativ dicht daran gehalten, was einfaches SVG so kann.
Oh, und ich bin mit Lukis Syntax mehr oder weniger kompatibel. Offenbar sind unsere Koordinatensysteme gegeneinander gespiegelt und gedreht, aber ansonsten sind alle Luki-Skripte bei mir lauffähig (aber nicht umgekehrt).
Als Bild habe ich einfach mal das Logo vom klassischen Mac OS nachgezeichnet, weil mir nichts besseres eingefallen ist.
Getestet in Firefox 19 und Chromium 25. Sollte prinzipiell in jedem ES5-fähigen Browser laufen, wenn ich nicht irgendwo noch einen Bug reingehauen habe, der nur zufällig in Gecko und V8 funtkioniert.
Die Webapp
Der Code (7-zip; 8,8 KiB)
Der Code (tar/bzip2; 9,5 KiB)
Das Beispielbild (SVG; 1,3 KiB)
So ... wir wurden gerade nochmal gefragt, ob man den Contest eventuell bis zum 14.04. laufen lassen koenne, da jemandem, der teilnehmen wollte, eine Deadline dazwischen gekommen ist.
Da massive Contestverlaengerungen bei uns im Progforum ja Tradition haben, und es fuer niemanden einen Nachteil darstellt, etwas mehr Zeit zu haben, um seinen Code oder seine Praesentation zu verschoenern, haben wir uns dafuer entschieden, diesem Wunsch nachzukommen.
Neuer Stichtag ist jetzt Sonntag, der 14. April 2013. Und das ist jetzt auch wirklich die letzte Deadline, sofern wir es uns nicht wieder anders ueberlegen.
--
So ... nun ist es wohl an mir, meinen Beitrag abzugeben ...
Ich koennte nun hier einen riesigen Post verfassen, aber stattdessen habe ich den ganzen Kram uebersichtlich und strukturiert auf einer Webseite praesentiert.
http://ineluki.rpg-atelier.net/Prog/...ki/Readme.html
Dort findet ihr sowohl eine Beschreibung, was ich gemacht habe, als auch die Quelltexte, den Turtle-Code, und die fertigen Graphiken. Das Lesen der Readme ist dringend empfolen !
Das gesamte Projekt kann in Einzeldateien oder als tar.bz2 heruntergeladen werden.
Da die so erstellten Graphiken recht gross sind (ca. 4 MB unkomprimiert, ca. 450 KB gzip komprimiert) verlinke ich sie hier nur.
Der von mir generierte Turtle-Code <- $ setzt factor auf 2, #RRGGBB setzt die Farbe auf RRGGBB
SVGZ mit Painting-Renderer und Option Speedup=10 <- Sorry, keine Internet Explorer Unterstuetzung
SVGZ mit Blending-Renderer <- Sorry, ich kann nix dafuer, dass der Internet Explorer Scheisse ist
SVGZ ohne Schnickschnack im Internet Explorer Kompatibilitätsmodus
Alle Codes sind unter Firefox und Chrome getestet. Internet Explorer 9 funktioniert nur mit dem IE-Renderer. Opera ist ungetestet, waere also schoen, wenn mir jemand bescheid geben koennte, ob dort alles funktioniert.
Als Programmiersprache habe ich GNU Awk verwendet. Warum ? Weil ich kann und sie dafuer eigentlich gar nicht gedacht ist.
OK, in Wahrheit mag ich diese tolle Scriptsprache und wollte mit meiner Einsendung demonstrieren, dass man durchaus anspruchsvolle Dinge mit Awk anstellen und auch große Datenmengen schnell verarbeiten kann. Zwar liegt der Schwerpunkt von Awk auf Regulaeren Ausdruecken und Textverarbeitung, aber mit ein paar kleinen Tricks kann man, wie hier gezeigt, durchaus auch byteweise arbeiten. Diejenigen von euch, die die BSD-Variante von awk benutzen, haben allerdings Pech gehabt, denn selbige unterstuetzt (noch) nicht die fuer meine Farbreduktion notwendigen binaeren Operatoren AND, RSHIFT und LSHIFT. Schade.
Was mich an Awk allerdings besonders stoehrt, ist, dass in der Sprache keine lokalen Variablen vorgesehen sind. ALLE Variablen sind global. Das fuehrt natuerlich unweigerlich zu Namenskollisionen. Der einzige Trick, mit dem man dies umgehen kann, ist, lokale Variablen mit uninitialisierten und unbenutzten optionalen Funktionsparametern zu emulieren, was ich an einigen Stellen auch getan und im Quelltext kommentiert habe. Die Syntax ist ziehmlich gewoehnungsbeduerftig, aber besser als gar nichts lokales. Leider ist Awk auch nicht objektorientiert, doch fuer so ein kleines Projekt, wie dieses hier, kann man ja mal darueber hinweg sehen. Wenigstens gibt es Funktionen, von denen ich auch regen Gebrauch mache.
So, jetzt ist aber genug geschwafelt. Viel Spass beim Begutachten meiner Einsendung. Ueber kosntuktives Feedback freue ich mich natuerlich besonders.
--
Ein BIld sagt mehr als tausend Worte
Es funktioniert allerdings nicht so ganz wie es soll, denn der Turtle wackelt immer nur an dieser Stelle hin und her:
Im Firefox läufts nicht nur schneller, der Turtle bewegt sich auch mit:
Der Turtle-Code ist schon heftig. Gibt es eigentlich einen einfachen Trick, wie man so ein Bild in Turtle-Code umsetzt? Kann mir nämlich nicht vorstellen, dass du für die Wege des Turtles die Pixel abgezählt hast
Die ppm2turtle.awk ist dazu da, den Turtle-Code des Bildes zu generieren. Wenn du in die Datei reinsiehst, findest du ausfuehrlich kommentiert, wie das Programm arbeitet. Effektiv gehe ich das ganze Bild Pixel fuer Pixel durch, ueberpruefe, ob der Pixel der aktuell zu bearbeitenden Farbe entspricht, und wenn ja, dann bewege ich die Turtle zu der entsprechdenen Position ohne Zeichnen, und mache einen kleinen Strich an Stelle des jeweiligen Pixels. Und damit der Turtle-Code nicht zu groß wird, zerlege ich die zeichenlose Bewegung der Turtle in Potenzen von 2 und und benutze die "Multipliziere $Length mit $Factor" und "Dividiere $Length mit $Factor" Befehle der Turtle um mich schneller in zuerst Y und dann X zu bewegen. Also ja, effektiv ist es im Moment Pixelzaehlen, aber automatisiert.
Es waere natuerlich schoener, wenn die Turtle zusammenhaengende Bereiche zuerst geschlossen ausmalt, aber dafuer muesste man entweder das Traveling-Salesman-Problem auf einer wirklich grossen Datenbasis loesen oder mit Contourplots arbeiten, die in diesem Beispiel ganz schoen zerklueftet und loechrig sein koennen. Das war mir dann doch viel zu viel Aufwand fuer diesen Contest.
--
Berechtigungen
Zitieren
