3 år sedan · dd31b1f506
--- a/class/Canvas/index.html
+++ b/class/Canvas/index.html
@@ -0,0 +1,13 @@
 
				+<!DOCTYPE html>
			
 
				+<html lang="en">
			
 
				+<head>
			
 
				+    <meta charset="UTF-8">
			
 
				+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
			
 
				+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
			
 
				+    <title>Document</title>
			
 
				+</head>
			
 
				+<body>
			
 
				+    <canvas id="canvas"></canvas>
			
 
				+    <script src="main.js"></script>
			
 
				+</body>
			
 
				+</html>
			
--- a/class/Canvas/main.js
+++ b/class/Canvas/main.js
@@ -0,0 +1,25 @@
 
				+let ctx = canvas.getContext("2d");
			
 
				+ctx.beginPath();
			
 
				+ctx.arc(50, 50, 50, Math.PI/6, -Math.PI/6, false);
			
 
				+ctx.lineTo(50, 50);
			
 
				+ctx.closePath();
			
 
				+ctx.strokeStyle = 'black';
			
 
				+ctx.fillStyle = "green";
			
 
				+ctx.fill();
			
 
				+ctx.stroke();
			
 
				+
			
 
				+ctx.beginPath();
			
 
				+ctx.arc(57, 25, 5, 0, 2 * Math.PI);
			
 
				+ctx.fillStyle = "black";
			
 
				+ctx.fill();
			
 
				+ctx.stroke();
			
 
				+
			
 
				+function drawCircle(e){
			
 
				+    ctx.beginPath();
			
 
				+    ctx.arc(e.layerX, e.layerY, 5, 0, 2 * Math.PI, false);
			
 
				+    ctx.fillStyle ="yellow";
			
 
				+    ctx.fill()  
			
 
				+    ctx.stroke();
			
 
				+}
			
 
				+
			
 
				+canvas.addEventListener("click", drawCircle);