Maison  >  Article  >  interface Web  >  Comment effacer un graphique sur un canevas HTML5 pour empêcher le déclenchement d'événements de survol ?

Comment effacer un graphique sur un canevas HTML5 pour empêcher le déclenchement d'événements de survol ?

PHPz
PHPzavant
2023-08-20 20:41:191395parcourir

Comment effacer un graphique sur un canevas HTML5 pour empêcher le déclenchement dévénements de survol ?

Pour effacer le graphique sur le canevas, supprimez l'élément et ajoutez un nouvel élément au conteneur parent comme indiqué ci-dessous :

var resetCanvas = function(){
   $('#results-graph').remove();  
   $(&#39;#graph-container&#39;).append(&#39;<canvas id = "results-graph"><canvas>&#39;);
   canvas = document.querySelector(&#39;#results-graph&#39;);

   ct = canvas.getContext(&#39;2d&#39;);
   ct.canvas.width = $(&#39;#graph&#39;).width(); // here we are resizing the new canvas element to parent width
   ct.canvas.height = $(&#39;#graph&#39;).height(); // here we are resizing the new canvas element to parent height
   var a = canvas.width/2;
   var b = canvas.height/2;

   ct.font = &#39;12pt Calibri&#39;;
   ct.textAlign = &#39;Align Left&#39;;
   ct.fillText(&#39;left aligned text on the canvas&#39;, a, b);
};

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!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer