Java Script Bibliotheken

Schon festgestellt? Dem Forum sind gerade alle Interaktionsmöglichkeiten genommen. :(

Mehr dazu unter: Abstimmung über das Forum

  • Gern. Der Browser arbeitet die Datei von oben nach unten ab. Das Javascript greift hier:

    Code
    1. $("#val").on("change", function () {

    auf das Input mit der ID "val"

    und hier:

    Code
    1. $(selector).each(function (idx, ele) {

    auf das Canvas mit der ID "display" zu. Steht das Javascript im Head, hat der Browser die Zeilen wo diese Elemente definiert werden, noch nicht abgearbeitet und sie sind deshalb undefiniert.

    Es kommt zu keiner Fehlermeldung, weil z. B. $("#val") dann ein leeres Array liefert.

  • uiii so ganz klar ist mir das nicht wann er auf was zugreift.


    kannst du mir vielleicht jede Zeile einzelnd erklären bzw. mit Kommentaren versehen.

    Wenn es nicht zuviel verlangt ist.


    wäre dir sehr dankbar.

  • OK, ich habe es mal versucht. Wenn Du den Code wirklich verstehen willst, empfehle ich, das jQuery-Tutorial hier bei html-siminar durchzuarbeiten.

  • ok ich werde es konkreter:

    und wo ist der Bereich wo ich den wert eingebe?

  • Zeile 7 erzeugt ein Eingabefeld, wo Du den Wert eingeben kannst:

    Code
    1. <input id="val" />

    Und ab Zeile 9 wird diesem ein Eventlistener zugewiesen, durch Aufruf der Funktion updateCircleDisplay() die Anzeige auf den Wert setzt, der im Eingabefeld eingegeben wurde.

  • hallo zusammen,

    ich habe es so hinbekommen jetzt mochte ich aber gerne eine if else Bedingung drin haben und sagen unter einem wert ist der kreis rot und drüber grün.

    ich hatte die Idee der variablen opts einer id zuordnen und dann über eine if else Bedingung

    if (value<10){

    $(id).css("colorCircle", "red");

    }

    else{

    $(id).css("colorCircle", "green");

    }

    kann man das so machen ? oder gibt es da was anderes ?

    mein Problem ist einfach das ich nicht weis wie ich der variablen eine id zuordnen kann und wohin die Bedingung im Code hinkommt.

    Dazu muss ich sagen, dass ich mehrere Kreise mit der Funktion generiere und jeder kreis hat seine eigene id. darum will ich das in der function realisieren.


    Ich hoffe es verwirrt nicht ^^

  • Nein, so wie Du es beschreibst, funktioniert es leider nicht, weil die Kreise keine HTML-Elemente sondern Layers von jCanvas sind.

    Ich habe mal etwas ausgearbeitet, was deinen Wunsch erfüllen sollte:

    Eine coole Erweiterung wäre jetzt noch, wenn der Text nicht springt sondern während der Animation herauf- bzw. herunter gezählt würde :-;

  • das funktioniert schon genau so will ich es auch haben aber du gehst halt über die id des display da ran und ich habe mehrere kreise auf dem Bildschirm und jeder kreis bekommt einen anderen wert aus einer Datenbank übergeben aus dem Grund kann ich nicht über die id da ran gehen.

    ich dachte das ich das einfach in die Funktion kreis erstellen mit rein tun kann.

  • Hallo nochmal von mir, jetzt brauche ich das selbe aber nur das es mir in einem horizontalen Balken angezeigt wird.

    ich versuche gerade das Kreisdiagramm umzustricken aber es klappt noch nicht ganz.

  • Hallo nochmal von mir, jetzt brauche ich das selbe aber nur das es mir in einem horizontalen Balken angezeigt wird.

    ich versuche gerade das Kreisdiagramm umzustricken aber es klappt noch nicht ganz.

    wie meinst du das das es in einen horizontalen balken angezeigt wird ...??

  • wie meinst du das das es in einen horizontalen balken angezeigt wird ...??

    jetzt zeige ich ja die zahl in einem Kreisdiagramm an aber nun soll es ein Balken sein der von links nach rechts immer größer wird

  • genau nur das links ein Text stehen soll.

    Dann soll der Balken ja bis rechts gehen und da soll dann auch die Uhrzeit angezeigt werden wienlange es noch dauert bis der Balken voll ist.

    Diese Zeit will ich übergeben und es müssen keine kommazahlen sein und es soll sich die Farbe von grün auf geld und dann rot ändern.

  • was willst du den angezeigt haben ...ich meine damit der balken kann ich 1 sekunde auf 100 stehen oder dafür 2 stunden dauern...willst du damit ein download anzeigen oder was auch immer...das muss man auch wissen damit die zeit berechnet werden kann wie lange es dauert bis er auf 100 prozent ist ....

    die farben könnte man in der css from bis to animieren bei einer festen zeit ... oder halt mit einer if abfrage fest zuweisen ...


    fals ich unrecht habe wird hier bestimmt einer was dazu sagen ...


    wenn du das

    Code
    1. y = x.toFixed(3);

    in das

    Code
    1. y = x.toFixed(0);

    änderst dann hast du keine komma zahl mehr

    Dieser Beitrag wurde bereits 2 Mal editiert, zuletzt von basti1012 ()

  • Gut gemacht, Basti! Solche eine Balkenanzeige kann man sehr gut mit HTML und CSS erzeugen.

    Ich habe trotzdem mal meine mit jCanvas umgestellt:

    Jetzt kann man beliebige Farben verwenden, weil die Schwellen und die Farben in einem Array übergeben werden.

  • Ich habe auch die Kreisanzeige erweitert, so dann man mehrere Farben verwenden kann:

  • Ich habe auch die Kreisanzeige erweitert, so dann man mehrere Farben verwenden kann:

    Hey sempervivum,

    vielen Dank für deine Hilfe.

    Bei dem Balken wird ja links der Wert angezeigt, ich möchte dort aber die restlichen Wert anzeigen lassen, also nicht wieviel der Balken schon voll ist sondern wieviel es noch braucht bis er voll ist. Und der Text soll rechts am Balken stehen und nicht links wie jetzt.

    Kannst du mir da ein letztes mal noch behilflich sein ?

    Dieser Beitrag wurde bereits 1 Mal editiert, zuletzt von detolopez ()