[QUIZ#14] Würfelkunst

Ich muss sagen, dass diese Art absolutes Neuland ist und ich mich hier erstmal zurechtfinden muss...
Danke Matthias für die Links, ohne die würde ich wahrscheinlich jetzt noch grübeln anstatt zu programmieren.

€dit: kommen wir mal zu meinem Stand bisher:

Ich habe bisher das Grauzeichnen und das Dithern übernommen, nun muss ich noch die Pixel mit Würfeln ersetzen, mal sehen wie ich das hinbekomme.

Ich arbeite mit Javascript und dem Canvas-Element von Html5, an dieser Stelle danke an Quaese, ich habe mir ein paar von deinen Codeschnipseln genommen ;)

€dit2: So, nun habe ich Probleme, kann mir jemand sagen, warum die Grafik verzerrt ist?
Ich dache mir ich lese immer ein Rechteck von 5x5 pixeln aus, errechne den Mittelwert der Farbe und platziere dementsprechend einen Würfel, aber warum sieht das so verzerrt aus?

Jemand eine andere Idee, wie ich die Würfel sonst ersetzen könnte?
 

Anhänge

  • canvas.png
    canvas.png
    15,9 KB · Aufrufe: 65
  • canvas1.png
    canvas1.png
    67,3 KB · Aufrufe: 53
Zuletzt bearbeitet:
Vielen Dank Matthias, dass du ein neues Coding Quiz ins Leben gerufen hast! :)
Ich hab mich in Java schonmal an der Abstufung versucht und nun aus einem Obama-Bild ein neues mit 8 Farben (pro Rot, Gün und Blau je zwei) erzeugt.

Das Originalbild:
Bild.png

Ich kam dann zu folgendem Ergebnis:
Bild2.png

Ich habe dann mal Matthias' Tipp ausprobiert und den Floyd-Steinberg-Algorithmus angewendet, das Ergebnis war nun folgendes:
Bild3.png

Der Algorythmus bringt dem Bild wirklich eine deutliche Verbesserung. Danke für den Tipp! ;)

Das Ganze probiere ich noch bei Graustufen, danach kommen dann die Würfel. :-)
 
Chumper hat gesagt.:
€dit2: So, nun habe ich Probleme, kann mir jemand sagen, warum die Grafik verzerrt ist?
Ich dache mir ich lese immer ein Rechteck von 5x5 pixeln aus, errechne den Mittelwert der Farbe und platziere dementsprechend einen Würfel, aber warum sieht das so verzerrt aus?

Jemand eine andere Idee, wie ich die Würfel sonst ersetzen könnte?
Zum Vergrößern anklicken....
Sieht für mich nach einem klassischen „off by one“ aus. Vermutlich hast du dich bei der Bildbreite um 1 vertan.

Grüße,
Matthias
 
So dacht mir ich trag auch noch was bei:
Ich hab mich mal ne halbe Stunde hingesetzt und eine einfache Pixel2Dice Implementierung geschrieben.

Mona sieht mehr oder minder gut aus.
WIP :)

EDIT:
Irgendwie will der Floyd-Steinberg Algo bei mir nicht ganz -.-
Ich versuch auf 16 Farben runterzugehn und er macht mir ein paar Pixel so extrem.
*Essenhol und Durchschnauf* :)
 

Anhänge

  • MonaGreyDiceTest.jpg
    MonaGreyDiceTest.jpg
    156,5 KB · Aufrufe: 55
  • new.jpg
    new.jpg
    25 KB · Aufrufe: 55
Zuletzt bearbeitet:
So, dann gebe ich mal meine Bilder ab. Auch hier das Problem, dass die Qualität unter kleinen Bildern extrem leidet, außerdem ist es bei mir noch ein wenig hardcoded, ich versuche das mal zu änern.
Das Problem ist nur, dass bei 3000+ pixeln Seitenlänge Javascript ca. 3mal die Laufzeit des Skripts abbricht :)
ich hoffe ihr habt einen schnellen rechner bei meiner Lösung.
 

Anhänge

  • canvas.jpg
    canvas.jpg
    573,1 KB · Aufrufe: 49
  • canvas2.png
    canvas2.png
    8,3 KB · Aufrufe: 41
Hallo,

mir ist bei einigen eurer Ergebnisbilder aufgefallen, dass keine oder nur sehr wenige Einsen auftreten. Vielleicht lässt sich da ja über eine Kontrastspreizung (Normalisierung) noch was rausholen? Also erst den niedrigsten und höchsten Helligkeitswert berechnen und dann eine lineare Abbildung der auftretenden Helligkeitswerte auf den Bereich 0-1 durchführen.

Grüße,
Matthias
 
Ich hab das ganze in .Net für Windows Forms gemacht.

Hier mal 2 Bilder:

cubeobama.png

cubebldcas.png


Programme läuft als Exe unter Windows, kann es gern zum Download stellen.

War in Sachen Grafikbearbeitung mein erstes tun also bitte keine schweren Sachen nach mir werfen ^^.

Ich glaube durch 3x3 große Würfel würd man mehr sehen, mal gucken ob ichs noch einbaue ^^.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück