Raytracer in JS

OnlyFoo

Erfahrenes Mitglied
Heyho,
hab heute in ner Vorlesung langeweile gehabt und, da ich schon länger wieder nichts in Javascript gemacht habe, einen kleinen Raytracer geschrieben.
Unterstütz werden unendliche Flächen und Kugeln, alles andere dürfte aber leicht zu implementieren sein. Licht in unterschiedlichen Farben und Schatten sind implementiert.
Screenshot gibts hier (hat über 5minuten gedauert): http://keller-delirium.de/~olli/js_raytracer/raytracer.png
Den Raytracer zum selbst testen gibts hier: http://keller-delirium.de/~olli/js_raytracer/raytrace.html
Wär schön, wenn noch mal jemand einen Vergleich Firefox 2/3 machen könnte :)
So, sagt was dazu,
Gruß, Olli
 
Hi,

du machst deinem (neuen) Benutzertitel mal wieder alle Ehre: Nice Job :)

Von mir gibt's für die Präsentation wieder fünf goldene Sterne ;)
 
Hi,

wahrscheinlich hätte ich versucht, Langeweile während einer Vorlesung anders zu bekämpfen - deine Variante scheint mir allerdings die bessere zu sein.

Auch von mir 5 Sterne!

Ciao
Quaese
 
=)

Hab heut Abend noch etwas weiter gearbeitet. Es gibt nun Spiegelungen und Transparenz/Bechung, sowie eine dynamische Textur und Umgebunslicht für einzelne Objetkte.
Das ganze sieht jetzt so aus: http://keller-delirium.de/~olli/js_raytracer/raytracer.png
Die Links im ersten Post sind jetzt auch aktualisiert =)

Im Firefox3 läuft das ganze übrigens um einiges schneller... 640x480 benötigt etwa die Hälfte der Zeit trotz neuer Features... und 80x60px geht gut vier bis fünf mal so schnell =) Also, Hut ab vor Firefox3!

Gruß, Olli
 
Hallo OnlyFoo,

das ist sehr beeindruckend. Ich habe recht viel Erfahrung was Rasterization angeht, würde aber auch gerne mal nen Raytracer schreiben. Besteht eine Chance, dass Du Deinen Code mal ausführlich dokumentierst? Hättest Du für mich vielleicht eine Source (z.B. eine Webseite mit einem Tutorial, nen technisches Paper o.Ä.) wo man die Infos über Raytracing Algos kompakt nachlesen kann (ich bräuchte z.B. keine Erklärungen über Vektoren, Farbberechnungen oder ähnliches)?

Das wäre klasse, danke!
 
@OnlyFoo: Und was kommt als nächstes?:)

Ein Holodeck mit JS(ich persönlich würde mir eher einen Speisenreplikator wünschen :))
 
Hallo OnlyFoo,
dass Du Deinen Code mal ausführlich dokumentierst? Hättest Du für mich vielleicht eine Source (z.B. eine Webseite mit einem Tutorial, nen technisches Paper o.Ä.) wo man die Infos über Raytracing Algos kompakt nachlesen kann (ich bräuchte z.B. keine Erklärungen über Vektoren, Farbberechnungen oder ähnliches)?
Das wäre klasse, danke!

mal schauen, wenn du glück hast kann ich das eben machen, aber der Code ist nicht der sauberste...
Ich hab keinerlei Infos drüber gehabt, Vektorrechnung und co aus der Schule waren die Grundlagen dafür, gepaart mit etwas Fantasie: "Ich werfe einen Strahl für jeden Pixel meines Bildes. Wenn der etwas trifft, dann hab ich die Farbe an dem Punkt. Von dem Punkt aus verbinde ich zu jeder Lichtquelle. Wenn dort was im Wege ist: Schatten, sonnst: Helligkeit abhängig vom Einfallswinkel. Falls das Objekt spiegelt: Physik achte Klasse: Einfallswinkel = Ausfallswinkel -> Rufe die Ich-Werfe-den-Strahl-Methode nochmal auf mit neuem Startpunkt und Richtung, mische die daraus resultierende Farbe und fertig... =).. Das ganze evnt zwei, drei mal rekursiv, je nachdem...


@OnlyFoo: Und was kommt als nächstes?:)
Ein Holodeck mit JS(ich persönlich würde mir eher einen Speisenreplikator wünschen :))

Ach, ich glaub das wird noch nichts... Aber Speisereplikator klingt gut *wasser im mund*

EDIT: etwas überarbeitet und kommentiert: http://keller-delirium.de/~olli/js_raytracer/raytracer.zip
 
Zuletzt bearbeitet:
Einfach geil!

Wenn du das ganze jetzt noch zurück an den Server schickst - als Bild, versteht sich - kannst du eine Menge Rechenzeit in was-weis-ich-für-einer Applikation an den Client auslagern. Und wenn Du das mit dem Repli schaffst, hast du den Pizzaservice neu erfunden... :p

Gruß
Enum
 
Zurück