Klasa Segment (HTML5 canvas)

Klasa Segment

Klasa opisująca odcinek. Dziedziczy po Figure. Klasa korzysta z dodatkowej funkcji distance.

Konstruktor

0, 1, 2 albo 4 argumenty.

var Segment = new Segment(). Tworzy odcinek zerowy o współrzędnych P₁(0.0, 0.0) oraz P₂(0.0, 0.0).

var Segment = new Segment(new Array(new Point(x1,y1), new Point(x2,y2))). Przyjmuje tablicę zawierającą dwa punkty Point. Tworzy odcinek między tymi punktami.

var Segment = new Segment(new Point(x1,y1), new Point(x2,y2)). Przyjmuje dwa punkty Point. Tworzy odcinek między tymi punktami.

var Segment = new Segment(x1, y1, x2, y2). Przyjmuje cztery wspołrzędne dwóch punktów. Tworzy dwa punkty Point i odcinek między tymi punktami.

Właściwości

Właściwości

Właściwość	Opis	Wartość lub klasa obiektu	Wartość domyślna
points	tablica zawierająca dwa punkty Point tworzące ten odcinek	Array	[]

Funkcje

Funkcje

Typ zwracany	Nazwa	Opis	Przykład
liczba rzeczywista	length()	Oblicza długość tego odcinka.	Rysowanie odcinka
Segment	deepclone()	Tworzy głęboką kopię tego odcinka.
Point	barycenter()	Zwraca punkt Point będący środkiem (ciężkości) odcinka.
void	draw(context)	Odrysowuje ten odcinek na kontekście context podanym jako argument.

Listing

    var Segment = function() {
	this.points = [];
	var len = arguments.length;
	if (len == 0) {
		this.points[0] = new Point(0.0, 0.0);
		this.points[1] = new Point(0.0, 0.0);
	} else if (len == 1) {
		for (var i = 0; i < 2; i++) {
			this.points[i] = new Point(arguments[0][i].x, arguments[0][i].y);
		}
	} else if (len == 2) {
		this.points[0] = new Point(arguments[0].x, arguments[0].y);
		this.points[1] = new Point(arguments[1].x, arguments[1].y);
	} else if (len == 4) {
		this.points[0] = new Point(arguments[0], arguments[1]);
		this.points[1] = new Point(arguments[2], arguments[3]);
	}
};
Segment.prototype = new Figure();
Segment.prototype.length = function() {
	return distance(this.points[0], this.points[1]);
}
Segment.prototype.deepclone = function() {
	var figure = new Segment();
	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);
	}
	return figure;
};
Segment.prototype.barycenter = function() {
	var x = (this.points[0].x + this.points[1].x) / 2.0;
	var y = (this.points[0].y + this.points[1].y) / 2.0;
	return new Point(x, y);
};
Segment.prototype.draw = function(context) {
	context.save();
	context.beginPath();
	this.setProps(context);
	context.moveTo(this.points[0].x, this.points[0].y);
	context.lineTo(this.points[1].x, this.points[1].y);
	if (this.stroke == true) {
		context.stroke();
	}
	context.restore();
};
function distance(pointA, pointB) {
	var a = pointB.x - pointA.x
	var b = pointB.y - pointA.y;
	return Math.sqrt(a * a + b * b);
};