horizontales Balkendiagramm erstellen

[Der Martin]

Hallo,

Ich hab deinen Code einmal bei mir eingebunden und nix abgeändert, ...

... bis auf die kleinen Optimierungen, die Kai empfohlen hat - und das ist okay so.

Das Problem ist jetzt, dass bei der Grafik keine Balken angezeigt werden.

*g*
Sorry, mir war nicht klar, dass du in Javascript völlig unerfahren bist; ich hatte angenommen, du würdest dich "ein bisschen" auskennen und wärest in der Lage, den Code zumindest nachzuvollziehen und zu verstehen.

Dann hättest du nämlich bemerkt, dass ich nirgends einen Aufruf der Funktion UpdateBar() notiert habe. Das war mir so selbstverständlich, dass ich völlig vergessen habe, das zu erwähnen.

Ja, also ... UpdateBar() ist natürlich dafür gedacht, bei jedem Aufruf einen der Balken mit einem neuen Wert zu versorgen und ihn entsprechend diesem Wert im Verhältnis zu seinem range (Wertebereich) zu skalieren. Das kann quasi-statisch passieren; es kann auch dynamisch wieder und wieder erfolgen, um Werte "in Echtzeit" darzustellen, die sich permanent ändern können.

Pack mal zur Demonstration irgendwo in dein Testdokument noch ein Eingabefeld mit einem JS-Eventhandler, etwa so:

<input type="text" onchange="UpdateBar(0,this.value);">

Das heißt: Jedesmal, wenn sich der Inhalt des Eingabefelds ändert (onchange), wird die Funktion UpdateBar() aufgerufen und bekommt als ersten Parameter den Wert 0 (damit wird der erste definierte Balken angesprochen), und als zweiten Parameter den aktuellen Inhalt des Eingabefelds (this.value). Und nun gib mal testweise Zahlenwerte zwischen -5000 und +5000 ein. Teste auch mal Zahlen, die diesen Wertebereich überschreiten, und schau dir an, was in diesem nicht abgesicherten Fehlerfall passiert.
Beachte, dass onchange erst anspricht, wenn das Eingabefeld den Focus verliert, der Cursor also nicht mehr im Feld steht.

Prinzip verstanden?

Auf diese Weise kannst du nun jederzeit und an jeder Stelle, wo es dir sinnvoll erscheint, einen der Balken (oder auch mehrere) aktualisieren. Mindestens einmal muss das allerdings passieren, denn die statischen Voreinstellungen zeigen ja alle Balken mit der Breite 0, also für den Wert 0 an.

So long,
 Martin