drsoong

Im anhängenden Bild links ist ein GD2 generiertes PieChart, rechts sind HTML-Tabellen mit entsprechenden Einträgen.

Ich möchte bei einem Mouseover links z. B. über Rot, dass rechts
das entsprechende Element in der Tabelle hevorgehoben wird.

Dazu müßte ich wohl die Farbe des jeweiligen Kuchenstücks auslesen.

Nach einer kurzen Googlerecherche scheint das aber nicht zu gehen.

Gesehen habe ich so etwas schon mal, nur wie wird's gemacht?

Miniaturansicht angehängter Grafiken

 

__________________
Es ist schon alles gesagt. Nur noch nicht von allen.

Mister Ad

chorn

Vllt hilft dir das hier weiter

http://stackoverflow.com/questions/1...el-of-an-image

oder hart sein und die Bildinformationen als JSON in Javascript hinterlegen.

ChrisB

Mein erster Vorschlag wäre eine simple Image-Map – die Koordinaten der Areas dynamisch zu berechnen, dürfte ja nicht so schwierig sein.

Wenn du wirklich Farbwerte auslesen willst – dann Canvas.

__________________
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

drsoong

Via Canvas finde ich eigentlich fortschrittlicher. Allerdings hatte ich erst kürzlich versucht, per exCanvas solche Charts auch für IE lt 9 zu realisieren, was einen Fehler nach dem anderen gebracht hat, weswegen ich von Canvas im Moment, außer für Smartphones, noch Abstand nehme.

Deswegen wäre Image-Map wohl doch interessanter. Allerdings einfach - um nicht zu sagen, ich habe gar keine Ahnung - finde ich die Berechnung
der Koordinaten nicht. Hast Du da nochmal einen Tipp für mich?

__________________
Es ist schon alles gesagt. Nur noch nicht von allen.

ChrisB

Ein bisschen Schul-Geometrie wieder ausgraben …?

Die Kreissegmente sind im wesentlichen Dreiecke, deren Eckpunkte berechnen sich ziemlich simpel – Radius, Winkelfunktionen, etc.
Wenn die Rundung der äußeren Kante auch „rund“ sein soll, musst du da feinere Abstufungen nehmen, bzw. dich an ein Bogensegment von einen zum anderen Eckpunkt annähern.

__________________
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

rudygotya

Oder anstelle von canvas svg/vml : http://raphaeljs.com/pie.html

__________________
++++ Wieder einer ins Netz gegangen: Phishers Fritz zufrieden ++++
Blog

drsoong

Es ist leider noch etwas schwieriger. Mein Kreis ist verzerrt des Räumlichkeitseffekts wegen, eine Ellipse also. Da muss ich noch mal schauen, wie man da die Segmente absteckt. Da das Ganze aber eher ein Nice-to-have ist, werde ich ich auf einen wacheren Moment warten. Danke erst mal an alle.

__________________
Es ist schon alles gesagt. Nur noch nicht von allen.

ChrisB

Sieht nach einer simplen Stauchung der Grafik aus – das kriegt man über Multiplizieren der Koordinaten auf einer Achse mit einem Faktor hin.

__________________
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?

drsoong

Danke noch mal an ChrisB. Werde also die simple Image-Map mit ein bisschen Schul-Geometrie, simpel zu berechnenden Dreiecken unter Berücksichtigung der simplen Grafikstauchung ganz locker aus dem Ärmel schütteln.

Ne, jetzt mal ehrlich. Habe zwar schon mal erfolgreich berechnen können, wie z. B. das PieChart umgebende Beschriftungen zu positionieren sind, was voraussichtlich eine recht ähnliche Herausforderung ist, werde es aber wohl nicht so leicht haben, wie Du es hier andeutest. Das liegt aber wahrscheinlich nur an meinem IQ und meiner Vorbildung.

__________________
Es ist schon alles gesagt. Nur noch nicht von allen.

nikosch

Berechnen sich die Winkel einer Ellipse nicht einfach durch die Kreisfunktionen * einem Faktorm sozusagen der Abplättung? Ist doch bloss x/y..

__________________
--
One pixel is still too big. Please make it smaller. ASAP.

Initiative Mittelstand.
Die wichtigste Gestaltungsregel im Screendesign ist Pi mal Daumen des Arbeitgebers.
--