Ergebnis 1 bis 6 von 6
  1. #1
    lukme ist offline Mitglied
    registriert
    18-05-2014
    Beiträge
    28

    Input range dynamische Variable Potrace/Livepreview

    Hallo liebes Forum,

    ich arbeite momentan an einem Projekt, wo ich mit dem Javascript-Port von Potrace
    HTML-Code:
    http://kilobtye.github.io/potrace/
    arbeite.
    Ich habe vor eine Live-Preview/Render Funktion zu implementieren. Es soll für verschiedene Variablen Input-Range Elemente verwendet werden, das SVG nach der Änderung des Wertes/onchange neuberechnet werden.
    Nun bin ich soweit, dass ich die Verbindung zwischen Input-Range und der Variable hergestellt habe - wenn ich die Input Value von z.B. 20 vorgebe, wird das Bild mit diesem Wert gerechnet. Bei Änderung des Wertes tut sich jedoch noch nichts. Was mache ich falsch? Wie kann ich dieses Problem lösen?

    HTML-Code:
    <input id="tolerance" value="4" min="0" max="30" step="0.5" type="range" onchange="rerender();" >
    <div id="svgdiv"> </div>
    Code:
    //Funktion zur direkten Berechnung bei Image-Upload
    function handleFiles(files) {
      Potrace.loadImageFromFile(files[0]);
      Potrace.process(function(){
        displaySVG(1);
      });
    }
    //Anzeigen der fertig berechneten SVG
    function displaySVG(size, type){
      var svgdiv = document.getElementById('svgdiv');
      svgdiv.style.display = 'inline-block';
      svgdiv.innerHTML = "<p>Result:</p>" + Potrace.getSVG(size, type);
    }
    //Meine Funktion zur Neuberechnung des Bildes
    function rerender(){
        Potrace.loadImageFromFile(files[0]);
        Potrace.process(function(){
        displaySVG(1);
      });
    }
    Und noch meine Verknüpfung zum genannten Wert aus der potrace.js
    Code:
    turdsize: parseInt(document.getElementById("tolerance").value),
    Ich freue mich über jegliche Hilfe.

    Gruß
    lukmorf

  2. #2
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.695

    AW: Input range dynamische Variable Potrace/Livepreview

    Du musst in dem onchange den Wert des <input> schon neu auslesen und an das potrace.js übergeben. Denn das
    Zitat Zitat von lukme Beitrag anzeigen
    Code:
    turdsize: parseInt(document.getElementById("tolerance").value),
    liest nur den aktuellen Wert aus und stellt keine logischen/programmiertechnisch Verbindung her.

  3. #3
    lukme ist offline Mitglied
    registriert
    18-05-2014
    Beiträge
    28

    AW: Input range dynamische Variable Potrace/Livepreview

    Hi, wie stelle ich denn die Verbindung dazu her?

  4. #4
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.695

    AW: Input range dynamische Variable Potrace/Livepreview

    Das geht gar nicht. Wie ich oben schon geschrieben hab': du musst in dem onchange den Wert neu auslesen und an das potrace übergeben.

  5. #5
    lukme ist offline Mitglied
    registriert
    18-05-2014
    Beiträge
    28

    AW: Input range dynamische Variable Potrace/Livepreview

    Ich stehe komplett auf dem schlauch. Beim Input also etwas wie onchange="this.value" ?

  6. #6
    Avatar von kkapsner
    kkapsner ist offline Super Moderator
    registriert
    28-03-2008
    Beiträge
    17.695

    AW: Input range dynamische Variable Potrace/Livepreview

    Nein.

    Ich kenne mich mit potrace gar nicht aus, aber irgendwie sowas wie:
    Code:
    POTRACE_VARIABLE.turdsize = parseInt(this.value, 10);
    - - - Aktualisiert - - -

    oder
    Code:
    POOTRACE_VARIABLE.setTurdsize(parseInt(this.value, 10));

Ähnliche Themen

  1. Range Slider Plugins
    Von Haxy123 im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 20-07-2014, 18:21
  2. IP Range (Bereich) sperren
    Von Ron Wood im Forum Serverseitige Programmierung
    Antworten: 6
    Letzter Beitrag: 13-02-2010, 23:09
  3. dynamische Input-Feld: Wert onClick übertragen
    Von ronjambo im Forum JavaScript
    Antworten: 4
    Letzter Beitrag: 05-03-2009, 16:07
  4. tabelle als range definieren
    Von pello im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 21-02-2008, 16:26
  5. Dynamische Input-Namen !?
    Von D3nt4r-Fox im Forum JavaScript
    Antworten: 2
    Letzter Beitrag: 30-03-2007, 01:53

Stichworte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •