Maison > interface Web > tutoriel HTML > HTML5 Canvas prend-il en charge la double mise en mémoire tampon ?

HTML5 Canvas prend-il en charge la double mise en mémoire tampon ?

WBOY
Libérer: 2023-08-19 11:05:11
avant
1472 Les gens l'ont consulté

HTML5 Canvas支持双缓冲吗?

Pour une double mise en mémoire tampon de la toile, créez un deuxième élément de toile et dessinez dessus. Utilisez ensuite la méthode drawImage() pour dessiner l’image sur le premier canevas.

// canvas element
var canvas1 = document.getElementById('canvas');
var context1 = canvas1.getContext('2d');

// buffer canvas
var canvas2 = document.createElement('canvas');
canvas2.width = 250;
canvas2.height =250;
var context2 = canvas2.getContext('2d');

// create on the canvas
context2.beginPath();
context2.moveTo(10,10);
context2.lineTo(10,30);
context2.stroke();

//render the buffered canvas
context1.drawImage(canvas2, 0, 0);
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:tutorialspoint.com
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal