Wie speichere ich eine Leinwand als Bild mit „canvas.toDataURL()'?

Speichern einer Leinwand als Bild mit canvas.toDataURL()

Das Erstellen von Webanwendungen erfordert oft die Möglichkeit, eine Leinwand als Bild zu speichern. canvas.toDataURL() bietet eine Methode zum Konvertieren eines Canvas-Elements in eine Bilddaten-URL. Bei der Verwendung dieser Funktion können jedoch Probleme auftreten.

Ein häufiges Problem besteht darin, dass das Bild nicht korrekt gespeichert wird. Um dieses Problem zu beheben, berücksichtigen Sie den folgenden Code:

<code class="js">function putImage() {
  var canvas1 = document.getElementById("canvasSignature");
  var ctx = canvas1.getContext("2d");

  // Change the format of the dataURL to "image/octet-stream" instead of "image/png".
  var myImage = canvas1.toDataURL("image/octet-stream").replace("image/png", "image/octet-stream");

  var imageElement = document.getElementById("MyPix");
  imageElement.src = myImage;
}</code>

Durch die Konvertierung des dataURL-Formats in „image/octet-stream“ können Sie sicherstellen, dass das Bild fehlerfrei lokal gespeichert werden kann.

Das obige ist der detaillierte Inhalt vonWie speichere ich eine Leinwand als Bild mit „canvas.toDataURL()'?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!