如何從 HTML5 畫布中清除圖表,以便無法觸發懸停事件?


若要從畫布中清除圖表,刪除 <canvas> 元素,然後向父容器附加新的 <canvas> 元素,如下面給出的程式碼所示 −

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

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

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

更新日期:2020 年 6 月 24 日

179 次瀏覽

開啟你的職業生涯

透過完成該課程獲得認證

立即開始
廣告
© . All rights reserved.