Переглянути джерело

Методы объектов и контекст исполнения функции

Oleg 6 роки тому
батько
коміт
ca34ee480a
2 змінених файлів з 53 додано та 0 видалено
  1. 14 0
      JS_20.03.2018/index.html
  2. 39 0
      JS_20.03.2018/script.js

+ 14 - 0
JS_20.03.2018/index.html

@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+	<meta charset="UTF-8">
+	<title>document</title>
+	<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+	<script type="text/javascript" src="script.js"></script>
+</head>
+<body>
+
+	<canvas id="canvasID"></canvas>
+
+</body>
+</html>

+ 39 - 0
JS_20.03.2018/script.js

@@ -0,0 +1,39 @@
+function Figure(x,y,color) {
+	this.x = x;
+	this.y = y;
+	this.color = color;
+};
+
+function Circle(x,y,r,color) {
+	Figure.call(this,x,y,color);
+
+	this.draw = function() {
+
+		var canvas = document.getElementById("canvasID"),
+			ctx = canvas.getContext("2d");
+
+		// ctx.strokeStyle = "#000";   - граница
+	    ctx.fillStyle = color;
+	    ctx.beginPath();
+	    ctx.arc(x, y, r, 0, Math.PI*2, true);
+	    ctx.closePath();
+	    // ctx.stroke();
+	    ctx.fill();
+	};
+};
+
+function Canvas() {
+
+	this.add = function() {
+
+	}
+};
+
+
+
+//------------------//
+
+// var line = new Line(50, 250, 200, 200, 'red'); // x1, y1, x2, y2, color
+var circle = new Circle(120, 100, 50, 'green'); // x, y, r, color
+circle.draw();
+// var rect = new Rect(260, 130, 60, 120, 'blue'); // x, y, w, h, color