1. 首頁
  2. 問答
  3. 帆布包含arcTo（）方法

帆布包含arcTo（）方法

2017-11-11 179 views
1

我玩HTML5畫布，我的書上說帆布包含arcTo（）方法

最新的瀏覽器支持包含arcTo方法，它有能力以去除 弧（）函數。

我的問題是怎麼回事？

我也很困惑與包含arcTo，爲什麼它得到這樣形成的這個例子可以有人解釋

<!DOCTYPE html> 
 
<html> 
 

 
    <head> 
 
    <link rel="stylesheet" href="style.css"> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body> 
 
    <canvas id="canvas" width="500" height="500" ></canvas> 
 
    
 
    <script> 
 
    var canvas = document.getElementById("canvas"); 
 

 
    var context = canvas.getContext('2d'); 
 

 
     var drawScreen = function(){ 
 
     \t context.moveTo(0,0); 
 
     \t context.lineTo(100,200); \t 
 
     \t context.arcTo(350,350,100,100,20); 
 
     \t context.stroke(); 
 
     } 
 
     
 
     drawScreen(); 
 
    </script> 
 
    </body> 
 

 
</html>

來源

2017-11-11 Sumeet

+0

這是[doc]（https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/arcTo） – Durga

回答

1

這裏是一些僞代碼解釋的JavaScript代碼，你如何發佈作品：

1) Get the canvas, and store it to variable 'canvas' 
2) Get the 2d context of 'canvas', and store it to variable 'context' 

3) Initialize a function, 'drawScreen', that takes no arguments, but runs the following instructions: 
    a) Move the pen to (0,0) on the canvas. 
    b) Draw a line from the pen's current position to (100, 100) 
    c) Draw an arc with a tangent line that passes through (350, 350) and the current pen position, and another tangent line that passes through (350, 350) and (100, 100), around a circle with radius 20. 
    d) Push the updated canvas to the screen. 
4) Run the function 'drawScreen'

不管你信不信，你可以用arcTo或其他命令的組合來完成同樣的事情arc會做，儘管有更多的工作，並且有許多在線的例子。

來源

2017-11-11 16:58:44 iPhoenix

相關問題

 相關問題