2016-04-28 156 views
0

當畫布尺寸較大時,繪製的線條根本不出現。大尺寸帆布2d不畫線

例子: http://jsfiddle.net/yu5gxgpt/3/

<canvas id="Grid" width="20000" height="16000"> 
</canvas> 

var context = canvas.getContext("2d"); 
context.beginPath(); 
context.moveTo(10, 20); 
context.lineTo(100, 20); 
context.strokeStyle = "#FF0000"; 
context.lineWidth = 1; 
context.stroke(); 

線不露面GRID1。如果我減小Grid1的大小,那麼這些線將被繪製。這是爲什麼?

瀏覽器測試:Chrome瀏覽器在OSX

+1

在我的機器上線工作正常,在IE11和Edge,但未能在Chrome和FF。瀏覽器對畫布元素具有大小限制。聽起來你已經達到了Chrome的大小限制。恕我直言,因爲過大的畫布使用更大的資源,我建議你重構你的代碼,使用1或更多的小畫布,而不是過大的畫布。 ;-) – markE

+0

啊,這是有道理的。你可以將其作爲答案張貼,以便我可以將其標記爲這樣嗎?謝謝! – ChrisU

回答