nicht angemeldet
(ODER?) wie realisiere ich ein "Malfeld"?
Hallo zusammen,
ich möchte auf einer meiner Seitene meinen Besucher eine 64 mal 64 Felder große Matrix anbieten, die selbiger per Mausklick mit einer Farbe "bemalen" darf. Also z.Bsp, zum vorstellen jetzt, ein Div-feld mit 64x64 6x6-Pixel großen Divs. Klickt der Besucher auf eins der Divs, ändert es einmal die Farbe.
Es kommt mir auf diese Matrix an, wie ich es realisiere, ist relativ wurscht. Ich habe es bisher so versucht:
-
wie oben beschrieben. Dynamisch 64x64 Divs auf den Bildschirm gebracht (ergibt 4096) - Nachteil: der Aufbau des Feldes dauert extrem lange.
-
auf der (noch divleeren) Matrixfläche die Mauskoordinaten überprüft und erst beim mausklick an der entsprechenden Stelle ein eingefärbtes Div gesetzt. - Nachteil: ab einer Anzahl von ca 100 Divs (also 100 eingefärbten Stellen) wird der Browser immer langsamer.
-
mehr aus Scherz die Div-Idee verworfen und das feld aus images zusammengebaut. Code ich die image-Tags direkt ins Dokument und lasse (bitte keinen Schreck bekommen) alt, border und höhen-breitenangaben weg, wird die datei satte 200 kb gross ;-))
-
Schreibe die die images dynamisch, dauerst wieder sehr lange.
_______
Nun komme ich zu den Schluß, daß mit meinen Tesafilmmethoden ich da nicht weiter komme, Zumal so etwas ja auch das ideale Anwendungsgebiet für ein Java-aplet wäre, aber ich scheue mich, vor allem mit Hinblick auf meinen vollen Schreitisch und einer endlosen todo-Liste, jetzt noch Java zu lernen, nur um eine 64x64 große matrix zu bekommen, auf der meine Besucher per Mausklicks die Flächen mit maximal zwei Farbe einfärben können.
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?
Chräcker
-
Moin!
Alle deine Versuche ergeben ein Resultat: Du hast es im Zweifel zwingend mit 4096 Objekten zu tun, das ist weit mehr, als eine normale durchschnittliche Seite jemals enthalten wird. Und die Zeit zum Bearbeiten dieser Objekte mit Javascript ist nicht gerade gering (was schlicht an deren Anzahl liegen dürfte).
Summa summarum kommst du ganz richtig, und genauso wie ich zu dem Schluß: Der Browser ist kein Malprogramm. Und das ist auch ganz gut so.
Zumal so etwas ja auch das ideale Anwendungsgebiet für ein Java-aplet wäre
Exakt (wenn überhaupt - aber was tut man nicht alles, wenn man sich erstmal was ausgedacht hat).
aber ich scheue mich, vor allem mit Hinblick auf meinen vollen Schreitisch und einer endlosen todo-Liste, jetzt noch Java zu lernen, nur um eine 64x64 große matrix zu bekommen, auf der meine Besucher per Mausklicks die Flächen mit maximal zwei Farbe einfärben können.
Tja, sooo viele Ideen, sooo wenig Zeit...
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?
Der Browser ist kein Malprogramm, hat Probleme mit Javascript und 4096 Objekten, und statische HTML-Seiten werden für sowas zu groß - welche anderen Möglichkeiten browserintern bleiben dann noch? Du mußt zwangsläufig auf die Hilfe von performanten Plugins ausweichen. Ob du nun Java nimmst oder es mit Flash versuchst: Beide haben sicherlich eine bessere Performance, und beide dürften andere Herangehensweisen eröffnen, als HTML+CSS+JS es erlauben.
Oder du schreibst dir dein eigenes Plugin zum Malen. :)
- Sven Rautenberg
-
Hallo,
Du hast es im Zweifel zwingend mit 4096 Objekten zu tun,
ja, da hast Du (wie mit dem rest auch) recht. Manchmal kann man "hintenherum" überaschende Dinge mit dem Browser anstellen, mit denen der besucher gar nicht rechnet (das macht ja den reiz mancher Seite von mir auch aus), aber stimmt schon, wie man es dreht und wendet, es bleiben 4096 zu verwaltenden Objekte..... Ach je, ich sehe schon Java auf mich zurollen....
Chräcker
PS.
aber was tut man nicht alles, wenn man sich erstmal was ausgedacht
hat).ich glaube ja sogar immer, daß ohne diese tolle angedachte Erweiterung meine bisherige Arbeit vollkommen sinnlos war, und das das jetzt jedem, wo ich die Erweiterung ja mal angedacht habe (ohne sie natürlich veröffentlicht zu haben) jedem auffällt, wie schlecht und unvollkommen die Seite so ist ,-))))
-
Moin,
Alle deine Versuche ergeben ein Resultat: Du hast es im Zweifel zwingend mit 4096 Objekten zu tun
Naja, man könnte das auf die Hälfte reduzieren, indem man einfach alles invertiert sobald der User das 2049. Kästchen ankreuzt, also dann den Hintergrund in der Malfarbe macht und die Kästchen in Hintergrundfarbe.
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?
Ja, du machst einfach nicht für jedes Kästchen eine einzelne Grafik, sondern zum Beispiel in Viererformation. Du hast dann also 16 Grafiken die jede Kombination der 4 Kästchen darstellen (lässt sich ja wohl problemarm vorladen) und tauscht dann immer diese grosse Grafik aus. Statt 64x64 brauchst du dann nur noch 32x32 Grafiken und das klingt schon eher so, als würde man das bewältigen können. Gegegebenenfalls kannst du das ja auf Neunerkästchen ausweiten, auch wenn dann das Vorladen wegfallen dürfte.
--
Henryk Plötz
Grüße aus Berlin-
Hallo,
Deine Idee ist so herrlich "krumm", daß sie mir auf anhieb gefält. Nun muß ich nur mal ausprobieren, ob sie auch "schnell" genug ist, um einen "Pinselstrich" auszuhalten, aber genau solche Ideen meinte ich. (Wenngleich ich auch immer mehr Bereiche meiner Todo-Liste zzusammenstreiche um Platz für Java-lernen zu machen ,-))
Danke,
wunderbar krumm ;-))))
Chräcker
-
Moin,
Deine Idee ist so herrlich "krumm", daß sie mir auf anhieb gefält. Nun muß ich nur mal ausprobieren, ob sie auch "schnell" genug ist, um einen "Pinselstrich" auszuhalten, aber genau solche Ideen meinte ich.
Was mir kurz nach meinem Post noch eingefallen ist: Je nach dem was du damit machen willst, könnte man auch größere Bilder vorhalten, in immer wieder auftauchenden Formen. Also zu Beispiel Striche oder Kreise in verschiedenen Längen und Ausrichtungen, oder ausgefüllte Flächen. Das vereinfacht die Programmierung zwar nicht unbedingt - das Skript müsste dann ein bisschen Zeit damit verbringen die bereits vorbereiteten Formen zu suchen - dürfte aber den Bildaufbau extrem beschleunigen, falls die vorbereiteten Formen gut gewählt sind.
PS: Mir fällt grade auf dass du in diesem Thread 3 verschiedene email-Addressen angegeben hast. ;-)
--
Henryk Plötz
Grüße aus Berlin
-
-
-
-
Moin Chraecker.
[snip]
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?Hm... Waere SVG nicht eine schoen standardkonforme Loesung?
Ciao!
Sebastian-
Hallo,
(peinlich) habe mich mit svg noch in keinster Weise beschäftigt und nur absolute Lücken im hirn ,-))) werde die mal schliessen "gehen"....
Danke,
Chräcker
-
-
Hallo Chräcker,
ich möchte auf einer meiner Seitene meinen Besucher eine 64 mal 64 Felder große Matrix anbieten, die selbiger per Mausklick mit einer Farbe "bemalen" darf. Also z.Bsp, zum vorstellen jetzt, ein Div-feld mit 64x64 6x6-Pixel großen Divs. Klickt der Besucher auf eins der Divs, ändert es einmal die Farbe.
Es kommt mir auf diese Matrix an, wie ich es realisiere, ist relativ wurscht. Ich habe es bisher so versucht:
- wie oben beschrieben. Dynamisch 64x64 Divs auf den Bildschirm gebracht (ergibt 4096) - Nachteil: der Aufbau des Feldes dauert extrem lange.
- auf der (noch divleeren) Matrixfläche die Mauskoordinaten überprüft und erst beim mausklick an der entsprechenden Stelle ein eingefärbtes Div gesetzt. - Nachteil: ab einer Anzahl von ca 100 Divs (also 100 eingefärbten Stellen) wird der Browser immer langsamer.
- mehr aus Scherz die Div-Idee verworfen und das feld aus images zusammengebaut. Code ich die image-Tags direkt ins Dokument und lasse (bitte keinen Schreck bekommen) alt, border und höhen-breitenangaben weg, wird die datei satte 200 kb gross ;-))
- Schreibe die die images dynamisch, dauerst wieder sehr lange.
Hast Du das auch schon mit den PHP-Graphikfunktionen ausprobiert? Da kann man manchmal auch ganz tolle Sachen machen...So hab ich den Browser auch mal zum malen missbrauchst ;-)
viele Grüsse
Kerstin-
Hallo Kerstin,
Hast Du das auch schon mit den PHP-Graphikfunktionen ausprobiert? Da kann man manchmal auch ganz tolle Sachen machen...So hab ich den Browser auch mal zum malen missbrauchst ;-)
würde mich jetzt auch mal interessieren, kannst Du uns da vielleicht
einen URL nennen, wo man sich sowas anschauen kann?PHP ist ja serverseitig und ich verstehe im Moment nicht so ganz,
warum es da zur Lösung eines clientseitigen Problemes hilfreich sein
soll. Klar, man kann nach jedem "Strich" die Sache serverseitig neu
erzeugen lassen, aber ob sowas sinnvoll ist? ;-)Viele Grüße,
Stefan -
Hallo,
Hast Du das auch schon mit den PHP-Graphikfunktionen ausprobiert? Da
ich kann ja nix ,-) (außer ein bissel JS und Bilder gestalten - und Windeln wechseln ;-)))).... habe also noch die freie Auswahl zwischen PHP, Perl, Java etc, weil ich die ja alle gleich nicht kann ;-) Aber bei php dachte ich immer, daß ist eine "baue-eine-Seite-zum-anzeigen-zusammen" Sprache, die also "direkt beim besucher" nichts dynamisch ändern kann, sondern nur Eingaben entgegen nehmen kann, diese dann an der Server schickt und dort "verarbeiten" läst, um sich dann mit einer dort neu zusammengestellten Seite auf den Weg zurück zum Besucher zu machen. (Wie perl ja auch) - ich brauche eher was, was ich zum besucher schicken kann und dort auf dem Computer läuft..... Dachte ich ,-)))
Chräcker
-
Hallo,
ich kann ja nix ,-) (außer ein bissel JS und Bilder gestalten - und Windeln wechseln
ich kann auch nix (ausser ein bissle php) ;-)
is mir jetzt fast ein bissle peinlich, weil die Seite im Moment nur ein kleiner unvollendeter Versuch einer meiner Spinnereien is, aber wer gackert muss schliesslich auch legen...
also schaut Euch mal http://labyrinth.kerstin-huppenbauer.de an und klickt dann mal ein bissle auf dem Labyrinth rum. Wie gesagt, ich kann nix und deshalb wusst ich auch nicht, wie ich das sonst machen soll, dass der Benutzer in das Labyrinth seinen Weg reinmalen kann. Vielleicht gibts ja jetzt sogar noch die ideale Lösung für mein Problem :-)viele Grüsse
Kerstin -
Moin,
Aber bei php dachte ich immer, daß ist eine baue-eine-Seite-zum-anzeigen-zusammen" Sprache, die also "direkt beim besucher" nichts dynamisch ändern kann, sondern nur Eingaben entgegen nehmen kann, diese dann an der Server schickt und dort "verarbeiten" läst
Jo, aber das liesse sich durchaus geschickt mit den anderen Ansätzen kombinieren. Du lässt lokal beim Client dann dein Javascript laufen, dass die Eingaben entgegennimmt und das Bild aus einzelnen Kästchen zusammenbaut. Ab und zu mal (etwa alle x Sekunden oder sobald y Kästchen ihre Farbe geändert haben) schickt es dann eine Anfrage an den Server ab und der baut mit den serverseitigen Funktionen den aktuellen Zustand als einzelne Graphik nach, die dann hinter die Zeichenfläche geklemmt wird. Die Einzelkacheln davor können dann entfernt werden. Wenn man das richtig macht (also den Austausch erst vornehmen wenn das 'gerenderte' Bild im Browser angekommen ist), kriegt der User nicht mal was davon mit und du hast die Anzahl der vom Browser zu verwaltenden Elemente wieder auf einzigartige Wiese nach unten gedrückt.
--
Henryk Plötz
Grüße aus Berlin
-
-
lieber Freund
- wie oben beschrieben. Dynamisch 64x64 Divs auf den Bildschirm gebracht (ergibt 4096) - Nachteil: der Aufbau des Feldes dauert extrem lange.
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?
Sehr seltsam ich bastel gerade an einer ähnlich Sache herum.
Hier mal eine "krumme" Idee:
Du lädst überhaupt keine Matrix (spart schon mal 4096 Objekte) sondern du erzeugst erst einen Layer in dem Moment in dem der User in das Malfeld klickt.Da ich mal vermute, das dies dafür gedacht ist, das der User sich seinen eigenen Stempel malen kann, dürfte es sehr unwahrscheinlich sein das dieser das ganze Feld ausmalt. Zu erwarten ist eher das er max einige hundert "Pixel" setzt.
Eine andere Möglichkeit wäre, das man eine Url mit einer Grafik angeben kann die, falls noch nicht geschehen, auf 64*64 skaliert wird und als Stempel verwendet werden kann.
Hoffe das bringt dich weiter.
Liebe Grüße aus Wien
Pipolino-
Hallo,
Sehr seltsam ich bastel gerade an einer ähnlich Sache herum.
...mach keinen Ärger, ich will nicht schon wieder so eine Schlappe erleben, wie mit Deinem Kasperltheater! ;-)
Da ich mal vermute, das dies dafür gedacht ist, das der User sich
seinen eigenen Stempel malen kann,WER HAT DAS VERRATEN????
Eine andere Möglichkeit wäre, das man eine Url mit einer Grafik
angeben kann die, falls noch nicht geschehen, auf 64*64 skaliert
wird und als Stempel verwendet werden kann.;-) aber das wäre nicht mehr Chräcker-Seite-like ,-) ich möchte ja so wenig "Computer" wie möglich drin haben. Ein Pinsel und ein Farbtöpchen sind doch viel netter als ein URL-Eingabefeld, zumal die meisten meiner Besucher gar nicht wissen, was "das alles ist". Auch sollen die leute ja selber malen. Und letztendlich, aber das kannst Du nicht wissen, sollen die eigenen Kreationen für alle" in die Seite kommen, und dazu muß ich die vorher "zensieren".... das ganze wird etwas aufwendiger udn "Seitenintegrierter".... und Schlußendlich besteht jedes Stempelmotiv aus 32 Grafiken(!), die ich alle hier erst einmal aus der einen Zeichnung der Besucher kreieren und einbinden muß....
Aber auch Dir mein Dank und wehe, Du baust eine Seite, die ich nur wieder nicht gemacht habe, weil ich darauf nicht gekommen bin!
Freu mich auf Hamburg,
Chräcker
-
Hallo Chräcker
Hat jemand noch eine krumme Idee, wie man so eine Matrix realisieren könnte?
Ja, auch ich bastel an so etwas - ohne schon fertig zu sein.
Die Version für den IE(ab 5.0) läuft schon. Die CrossBrowser Version braucht noch ein wenig.Anstelle von DIV-Tags habe ich eine Tabelle genommen, komme aber ebenfalls auf Performanceprobleme, schon bei einer Matrix 16*12, jedoch bedingt durch den Einsatz vieler Bilder. Offline ist es selbst auf einem 133mHz Rechner mit 32 mb Hauptspeicher erträglich. Deshalb plane ich eine Download-Empfehlung auszusprechen.
Falls jemand eine größere Matrix braucht, habe ich vorgesehen, das die Benutzer die Matrix selbst vergrößern können. Vielleicht ist das eine Idee für Dich.
Hier das Beispiel: http://www.jelue.de/konfig/zeichnung/linienV2.htm
Grüsse
Günter
p.s.: Die rudimentäre Bedienungsanleitung ist unter "Hilfe" zu finden.-
Hallo,
Ja, auch ich bastel an so etwas - ohne schon fertig zu sein.
gibts auch jemand, der sich mit was anderes beschäftigt? ;-)))))
Danke für Deinen Anschupser. Tabelle hatte ich schon mal anfangs angedacht, aber die würde ja Monstergroß werden.... (oder man baut die dynamisch auf, dann kann "man" ja auch ein Div-feld oder gar image-feld machen, dachte ich mir so....)
Übrigens ist mein div-Testlauf hier zu sehen.
http://www.stempelgeheimnis.de/diverses/malentest.html
(nur IE und mozilla bzw NS6/7..... und es gibt einen ignorierbaren fehler am Rand des Feldes, ansonsten einfach drüberstreichen und sehen, wie schnell ein rechner ins schwitzen kommen kann.... ich sehe es inzwischen so: Java ist auch eine nette Sprache ,-))))
Danlke an alle, mit so viel resonanz hätte ich gar nicht gerechnet ,-)
Chräcker
-