45 lines
1.2 KiB
JavaScript
45 lines
1.2 KiB
JavaScript
|
Canvas2Dw3D = function(object, width, height) {
|
||
|
|
this.object = object;
|
||
|
|
this.numberOfPoints = this.object.length;
|
||
|
|
this.width = width;
|
||
|
|
this.height = height;
|
||
|
|
this.origo2D = [this.width / 2, this.height / 2];
|
||
|
|
|
||
|
|
this.element = document.createElement("canvas");
|
||
|
|
this.element.width = this.width;
|
||
|
|
this.element.height = this.height;
|
||
|
|
this.context = this.element.getContext("2d");
|
||
|
|
this.context.strokeStyle = "rgb(0, 255, 0)";
|
||
|
|
|
||
|
|
this.parentElement = null;
|
||
|
|
|
||
|
|
this.drawObject();
|
||
|
|
}
|
||
|
|
|
||
|
|
Canvas2Dw3D.prototype.drawObject = function() {
|
||
|
|
var c, p, q;
|
||
|
|
for (c in this.object) {
|
||
|
|
p = this.object[c];
|
||
|
|
q = this.object[(c+1)%this.numberOfPoints];
|
||
|
|
this.drawLine([p[0], p[1]], [q[0], q[1]]);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
Canvas2Dw3D.prototype.drawLine = function(xy1, xy2) {
|
||
|
|
with (this.context) {
|
||
|
|
beginPath();
|
||
|
|
moveTo(-xy1[0]+this.origo2D[0], -xy1[1]+this.origo2D[1]);
|
||
|
|
lineTo(-xy2[0]+this.origo2D[0], -xy2[1]+this.origo2D[1]);
|
||
|
|
stroke();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
Canvas2Dw3D.prototype.setParentElement = function(obj) {
|
||
|
|
obj.appendChild(this.element);
|
||
|
|
this.parentElement = obj;
|
||
|
|
}
|
||
|
|
|
||
|
|
HTMLElement.prototype.appendCanvas2Dw3DChild = function(obj) {
|
||
|
|
obj.setParentElement(this);
|
||
|
|
}
|