Heim  >  Artikel  >  Web-Frontend  >  Was ist der HTML5-Clear-Canvas-Code?

Was ist der HTML5-Clear-Canvas-Code?

藏色散人
藏色散人Original
2023-01-28 09:53:322394Durchsuche

Es gibt drei Codes zum Löschen der Leinwand in HTML5: 1. Löschen Sie die Leinwand mit dem Code „function clearCanvas{...}“. 2. Löschen Sie die Leinwand mit der Methode „clearRect“. var c=document.getElementById(" myCanvas");var cxt=c.getContext("2d")..." Code löscht die Leinwand.

Was ist der HTML5-Clear-Canvas-Code?

Die Betriebsumgebung dieses Tutorials: Windows 10-System, HTML5-Version, DELL G3-Computer

Was ist der Code zum Löschen der Leinwand in HTML5?

HTML5-Methode zum Löschen der Leinwand

Fassen Sie die folgenden drei Möglichkeiten zum Löschen der Leinwand zusammen:

1. Die einfachste Methode: Da der Leinwandinhalt jedes Mal gelöscht wird, wenn die Höhe oder Breite der Leinwand zurückgesetzt wird, können Sie dies tun Verwenden Sie die folgenden Methoden, um es zu löschen:

function clearCanvas<span style="font-family: Verdana, Arial, 宋体;">()</span>
{
    var c=document.getElementById("myCanvas");
    var cxt=c.getContext("2d");
    c.height=c.height;
}

2. Verwenden Sie die Methode „clearRect“:

function clearCanvas()
{
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.clearRect(0,0,c.width,c.height);
}

3. Ähnlich wie bei Methode 2 können Sie die Leinwand mit einer bestimmten Farbe füllen, um den Zweck des Löschens zu erreichen:

function clearCanvas()
{
var c=document.getElementById("myCanvas");
var cxt=c.getContext("2d");
cxt.fillStyle="#000000";
cxt.beginPath();
cxt.fillRect(0,0,c.width,c.height);
cxt.closePath();
}

Empfohlene Anleitung : „HTML5-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWas ist der HTML5-Clear-Canvas-Code?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:Unterstützt vs2010 HTML5?Nächster Artikel:Unterstützt vs2010 HTML5?