Question

代码中有哪些更正可使其响应，并在用户点击的屏幕上显示圆形和矩形。

<script>
   function mouseDown(e) {
     var a= e.pageX - this.offsetLeft;
     var b= e.pageY - this.offsetTop;
   }

   function c1()
   {
    ctx.arc(currX,currY,41,0, 2*Math.PI);
    ctx.stroke();
   }
   function r1(e)
   {
    var a= e.pageX - this.offsetLeft;
    var b= e.pageY - this.offsetTop;
    ctx.rect(a,b,Math.abs(prevX - currX), Math.abs(prevY - currY)); 
    ctx.stroke();
   }
</script>

Answer 1

您可以使用窗口的宽度和高度来响应此画布。

我在下面尝试了一些代码，可以提供帮助。

<script>
 var canvas = document.getElementById('canvas_id'),
  ctx = canvas.getContext('2d');

 function init(){
   canvas.height = window.innerHeight(); //innerHeight is the viewable screen
   canvas.width = window.innerWidth();
 }

init(); //call this function when the page loads maybe in the body tag
</script>

关于制作圆圈和矩形的一点我不确定你要求的是什么。

如何使用bootstrap使HTML5画布绘制应用程序响应？

1 个答案: