Java: Mehrere Dinge in einer Funktion und kommentieren

Dieses Thema im Forum "Clientseitige Programmierung (HTML, JavaScript)" wurde erstellt von gpy, 14. April 2018.

  1. gpy

    gpy Inaktiv

    Hallo zusammen,

    seit Tage quäle ich mich mit einem Problem, welches wahrscheinlich eine Kleinigkeit ist, aber durch meine Ahnungslosigkeit in Sachen Java mich zur Verzweiflung treibt. Vielleicht kann ja jemand helfen.
    Auf folgender Website wird gezeigt wie man ein DIV als Bilddatei ausgibt: https://codepedia.info/convert-html-to-image-in-jquery-div-or-table-to-jpg-png/
    Es gibt 2 Javateile. Der erste erstellt eine Vorschau des Bildes, der zweite speichert dann das Bild. Leider kann man das Bild erst speichern, nachdem man die Vorschau erstellt hat. Das möchte ich nicht, sondern ich will das Bild ohne Vorschau direkt speichern.

    Andere User äußerten diesen Wunsch auch bereits in Fragen & Antworten. Der Webmaster schreibt dazu:
    "All you need to copy both button code into one function and comment this line $("#previewImage").append(canvas);."

    Trotzdem weiß ich nicht was ich machen muß. Vorallem was meint der Webmaster mit "comment" und wo muss die Zeile hinkopiert werden?

    Falls sich jemand erbarmt mir die Augen zu öffnen wäre ich sehr dankbar!

    JAVA TEIL 1 (Vorschau erstellen)
    //*
    var element = $("#html-content-holder"); // global variable
    var getCanvas; // global variable

    $("#btn-Preview-Image").on('click', function () {
    html2canvas(element, {
    onrendered: function (canvas) {
    $("#previewImage").append(canvas);
    getCanvas = canvas;
    }
    });
    });
    //*


    JAVA TEIL 2 (Bild speichern)
    //*
    $("#btn-Convert-Html2Image").on('click', function () {
    var imgageData = getCanvas.toDataURL("image/png");
    // Now browser starts downloading it instead of just showing it
    var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
    $("#btn-Convert-Html2Image").attr("download", "your_pic_name.png").attr("href", newData);
    });
    //*
     
  2. junkie34

    junkie34 Member

    Es ist JavaScript, nicht Java. Er meinte das wohl so:

    Code:
    var element = $("#html-content-holder"); // element to save as image
    
    $("#btn-Preview-Image").on('click', function () {
      html2canvas(element, {
        onrendered: function (canvas) {
         var imgageData = canvas.toDataURL("image/png");
         var newData = imgageData.replace(/^data:image\/png/, "data:application/octet-stream");
         $("<a></a>").attr("download", "your_pic_name.png").attr("href", newData).click();
        }
      });
    });
    
    Jetzt lädt der das runter, sobald man den Preview Button drückt.
     
    Zuletzt bearbeitet: 16. April 2018
  3. gpy

    gpy Inaktiv

    Vielen Dank für deine Mühe junkie34,
    leider funktioniert es bei mir nicht.
    Aber ich habe jetzt gelernt daß JavaScript und Java nicht das Gleiche sind.
    Schöne Grüße, Gerd
     
  4. gpy

    gpy Inaktiv

Diese Seite empfehlen