Klasa StarPolygon (HTML5 canvas)

Klasa StarPolygon

Klasa opisująca wielokąt (wielobok) gwiaździsty. Dziedziczy po Figure.

Konstruktor

0 lub 4 argumenty.

var starpolygon = new StarPolygon(). Przyjmuje punkt Point P(0,0) stanowiący środek wielokąta, sides – liczba boków (wierzchołków) wielokąta = 0, k – co ile boków, r – promień okręgu opisanego na wielokącie = 0.0.

var starpolygon = new StarPolygon(new Point(x,y), sides, k, r). Przyjmuje punkt Point stanowiący środek wielokąta, sides – liczba boków (wierzchołków) wielokąta, k – co ile wierzchołków, r – promień okręgu opisanego na wielokącie.

Właściwości

Funkcje

Funkcja
draw()
:
– obliczana jest liczba występujących figur. Figur jest
tyle jaki jest największy wspólny dzielnik (sides, k).
– po
podzieleniu długości tabeli punktów przez liczbę figur otrzymujemy
liczbę elementów w każdej figurze.
– tworzymy nową tabelę
punktów, w której punkty ułożone są w kolejności wykreślania.
– wykreślamy tyle figur ile ich jest, każda figura zamknięta jest
poleceniem
closePath()
.

Listing

// StarPolygon - wielokąt gwiaździsty
// Liczba argumentów
// 0 Tworzy wielokąt zerowy z jednym punktem P(0,0) i //promieniu (0,0)
// 4 środek P(x,y), liczba boków, co ile, promień;
var StarPolygon = function() {
	this.points = [];
	var len = arguments.length;
	if (len == 0) {
		this.center = new Point(0, 0);// środek wielokąta
		this.sides = 0;// liczba boków
		this.k = 0; // co ile wierzchołków
		this.r = 0; // promień okręgu opisanego
		this.points[0] = new Point(0.0, 0.0);
	} else if (len == 4) {
		this.center = new Point(arguments[0].x, arguments[0].y)
		this.sides = arguments[1];// liczba boków
		this.k = arguments[2]
		this.r = arguments[3];// promień okręgu opisanego
		this.points[0] = new Point(arguments[0].x + this.r, arguments[0].y);
		for (var i = 1; i < this.sides; i++) {
			this.points[i] = new Point(arguments[0].x + this.r
					* Math.cos(i * 2 * Math.PI / this.sides), arguments[0].y
					+ this.r * Math.sin(i * 2 * Math.PI / this.sides));
		}
	}
};
StarPolygon.prototype = new Figure();
StarPolygon.prototype.deepclone = function() {
	var figure = new StarPolygon();
	figure.globalAlpha = this.globalAplpha;
	figure.globalCompositeOperation = this.globalCompositeOperation;
	figure.strokeStyle = this.strokeStyle;
	figure.fillStyle = this.fillStyle;
	figure.shadowOffsetX = this.shadowOffsetX;
	figure.shadowOffsetY = this.shadowOffsetY;
	figure.shadowBlur = this.shadowBlur;
	figure.shadowColor = this.shadowColor;
	figure.lineWidth = this.lineWidth;
	figure.lineCap = this.lineCap;
	figure.lineJoin = this.lineJoin;
	figure.miterLimit = this.miterLimit;
	figure.lineDashOffset = this.lineDashOffset;
	figure.lineDashSegments = [];
	for (var i = 0; i < this.lineDashSegments.length; i++) {
		figure.lineDashSegments[i] = this.lineDashSegments[i];
	}
	figure.fill = this.fill;
	figure.stroke = this.stroke;
	figure.points = [];
	for (var i = 0; i < this.points.length; i++) {
		figure.points[i] = new Point(this.points[i].x, this.points[i].y);
	}
	figure.center = new Point(this.center.x, this.center.y);
	figure.sides = this.sides;
	figure.r = this.r;
	figure.k = this.k;
	return figure;
};
StarPolygon.prototype.barycenter = function() {
	return new Point(this.center.x, this.center.y);
};
StarPolygon.prototype.draw = function(context) {
	context.save();
	context.beginPath();
	this.setProps(context);
	var n = this.points.length;
	var k = this.k;
	var ilefigur = nwd2(n, k);
	var ileelem = n / ilefigur;
	var points1 = sortCyclic(this.points, k);
	if (ilefigur == 1) {
		context.moveTo(points1[0].x, points1[0].y)
		for (var i = 1; i < n; i++) {
			context.lineTo(points1[i].x, points1[i].y);
		}
		context.closePath();
	} else {
		for (var j = 0; j < n; j += ileelem) {
			context.moveTo(points1[j].x, points1[j].y)
			for (var m = j; m < j + ileelem - 1; m++) {
				context.lineTo(points1[m + 1].x, points1[m + 1].y)
			}
			context.closePath();
		}
	}
	if (this.stroke == true) {
		context.stroke();
	}
	if (this.fill == true) {
		context.fill();
	}
	context.restore();
};