|
@ -1254,6 +1254,48 @@ Graph3d.prototype.drawAxisLabelX = function(ctx, point3d, text, armAngle, yMargi |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Graph3d.prototype.drawAxisLabelY = function(ctx, point3d, text, armAngle, yMargin) { |
|
|
|
|
|
if (yMargin === undefined) { |
|
|
|
|
|
yMargin = 0; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
var point2d = this._convert3Dto2D(point3d); |
|
|
|
|
|
|
|
|
|
|
|
if (Math.cos(armAngle * 2) < 0) { |
|
|
|
|
|
ctx.textAlign = 'center'; |
|
|
|
|
|
ctx.textBaseline = 'top'; |
|
|
|
|
|
point2d.y += yMargin; |
|
|
|
|
|
} |
|
|
|
|
|
else if (Math.sin(armAngle * 2) > 0){ |
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
ctx.textAlign = 'left'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(text, point2d.x, point2d.y); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
Graph3d.prototype.drawAxisLabelZ = function(ctx, point3d, text, offset) { |
|
|
|
|
|
if (offset === undefined) { |
|
|
|
|
|
offset = 0; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
var point2d = this._convert3Dto2D(point3d); |
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(text, point2d.x - offset, point2d.y); |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
/** |
|
|
* Draw a line between 2d points 'from' and 'to'. |
|
|
* Draw a line between 2d points 'from' and 'to'. |
|
|
* |
|
|
* |
|
@ -1326,38 +1368,27 @@ Graph3d.prototype._redrawAxis = function() { |
|
|
step.start(true); |
|
|
step.start(true); |
|
|
|
|
|
|
|
|
while (!step.end()) { |
|
|
while (!step.end()) { |
|
|
|
|
|
var y = step.getCurrent(); |
|
|
|
|
|
|
|
|
if (this.showGrid) { |
|
|
if (this.showGrid) { |
|
|
from = new Point3d(this.xMin, step.getCurrent(), this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMax, step.getCurrent(), this.zMin); |
|
|
|
|
|
|
|
|
from = new Point3d(this.xMin, y, this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMax, y, this.zMin); |
|
|
this._line3d(ctx, from, to, this.gridColor); |
|
|
this._line3d(ctx, from, to, this.gridColor); |
|
|
} |
|
|
} |
|
|
else { |
|
|
else { |
|
|
from = new Point3d(this.xMin, step.getCurrent(), this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMin+gridLenY, step.getCurrent(), this.zMin); |
|
|
|
|
|
|
|
|
from = new Point3d(this.xMin, y, this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMin+gridLenY, y, this.zMin); |
|
|
this._line3d(ctx, from, to, this.axisColor); |
|
|
this._line3d(ctx, from, to, this.axisColor); |
|
|
|
|
|
|
|
|
from = new Point3d(this.xMax, step.getCurrent(), this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMax-gridLenY, step.getCurrent(), this.zMin); |
|
|
|
|
|
|
|
|
from = new Point3d(this.xMax, y, this.zMin); |
|
|
|
|
|
to = new Point3d(this.xMax-gridLenY, y, this.zMin); |
|
|
this._line3d(ctx, from, to, this.axisColor); |
|
|
this._line3d(ctx, from, to, this.axisColor); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
xText = (Math.sin(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
|
|
|
text = this._convert3Dto2D(new Point3d(xText, step.getCurrent(), this.zMin)); |
|
|
|
|
|
if (Math.cos(armAngle * 2) < 0) { |
|
|
|
|
|
ctx.textAlign = 'center'; |
|
|
|
|
|
ctx.textBaseline = 'top'; |
|
|
|
|
|
text.y += textMargin; |
|
|
|
|
|
} |
|
|
|
|
|
else if (Math.sin(armAngle * 2) > 0){ |
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
ctx.textAlign = 'left'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(' ' + this.yValueLabel(step.getCurrent()) + ' ', text.x, text.y); |
|
|
|
|
|
|
|
|
xText = (Math.sin(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
|
|
|
point3d = new Point3d(xText, y, this.zMin); |
|
|
|
|
|
var msg = ' ' + this.yValueLabel(y) + ' '; |
|
|
|
|
|
this.drawAxisLabelY(ctx, point3d, msg, armAngle, textMargin); |
|
|
|
|
|
|
|
|
step.next(); |
|
|
step.next(); |
|
|
} |
|
|
} |
|
@ -1370,19 +1401,22 @@ Graph3d.prototype._redrawAxis = function() { |
|
|
|
|
|
|
|
|
xText = (Math.cos(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
xText = (Math.cos(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
yText = (Math.sin(armAngle ) < 0) ? this.yMin : this.yMax; |
|
|
yText = (Math.sin(armAngle ) < 0) ? this.yMin : this.yMax; |
|
|
|
|
|
|
|
|
while (!step.end()) { |
|
|
while (!step.end()) { |
|
|
|
|
|
var z = step.getCurrent(); |
|
|
|
|
|
|
|
|
// TODO: make z-grid lines really 3d?
|
|
|
// TODO: make z-grid lines really 3d?
|
|
|
from = this._convert3Dto2D(new Point3d(xText, yText, step.getCurrent())); |
|
|
|
|
|
to = new Point2d(from.x - textMargin, from.y); |
|
|
|
|
|
this._line(ctx, from, to, this.axisColor); |
|
|
|
|
|
|
|
|
var from3d = new Point3d(xText, yText, z); |
|
|
|
|
|
var from2d = this._convert3Dto2D(from3d); |
|
|
|
|
|
to = new Point2d(from2d.x - textMargin, from2d.y); |
|
|
|
|
|
this._line(ctx, from2d, to, this.axisColor); |
|
|
|
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(this.zValueLabel(step.getCurrent()) + ' ', from.x - 5, from.y); |
|
|
|
|
|
|
|
|
var msg = this.zValueLabel(z) + ' '; |
|
|
|
|
|
this.drawAxisLabelZ(ctx, from3d, msg, 5); |
|
|
|
|
|
|
|
|
step.next(); |
|
|
step.next(); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
ctx.lineWidth = 1; |
|
|
ctx.lineWidth = 1; |
|
|
from = new Point3d(xText, yText, this.zMin); |
|
|
from = new Point3d(xText, yText, this.zMin); |
|
|
to = new Point3d(xText, yText, this.zMax); |
|
|
to = new Point3d(xText, yText, this.zMax); |
|
@ -1424,37 +1458,23 @@ Graph3d.prototype._redrawAxis = function() { |
|
|
var yLabel = this.yLabel; |
|
|
var yLabel = this.yLabel; |
|
|
if (yLabel.length > 0) { |
|
|
if (yLabel.length > 0) { |
|
|
xOffset = 0.1 / this.scale.x; |
|
|
xOffset = 0.1 / this.scale.x; |
|
|
xText = (Math.sin(armAngle ) > 0) ? this.xMin - xOffset : this.xMax + xOffset; |
|
|
|
|
|
yText = (this.yMin + this.yMax) / 2; |
|
|
|
|
|
text = this._convert3Dto2D(new Point3d(xText, yText, this.zMin)); |
|
|
|
|
|
if (Math.cos(armAngle * 2) < 0) { |
|
|
|
|
|
ctx.textAlign = 'center'; |
|
|
|
|
|
ctx.textBaseline = 'top'; |
|
|
|
|
|
} |
|
|
|
|
|
else if (Math.sin(armAngle * 2) > 0){ |
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
else { |
|
|
|
|
|
ctx.textAlign = 'left'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
} |
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(yLabel, text.x, text.y); |
|
|
|
|
|
|
|
|
xText = (Math.sin(armAngle ) > 0) ? this.xMin - xOffset : this.xMax + xOffset; |
|
|
|
|
|
yText = (this.yMin + this.yMax) / 2; |
|
|
|
|
|
text = new Point3d(xText, yText, this.zMin); |
|
|
|
|
|
|
|
|
|
|
|
this.drawAxisLabelY(ctx, text, yLabel, armAngle); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
// draw z-label
|
|
|
// draw z-label
|
|
|
var zLabel = this.zLabel; |
|
|
var zLabel = this.zLabel; |
|
|
if (zLabel.length > 0) { |
|
|
if (zLabel.length > 0) { |
|
|
offset = 30; // pixels. // TODO: relate to the max width of the values on the z axis?
|
|
|
offset = 30; // pixels. // TODO: relate to the max width of the values on the z axis?
|
|
|
xText = (Math.cos(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
|
|
|
yText = (Math.sin(armAngle ) < 0) ? this.yMin : this.yMax; |
|
|
|
|
|
zText = (this.zMin + this.zMax) / 2; |
|
|
|
|
|
text = this._convert3Dto2D(new Point3d(xText, yText, zText)); |
|
|
|
|
|
ctx.textAlign = 'right'; |
|
|
|
|
|
ctx.textBaseline = 'middle'; |
|
|
|
|
|
ctx.fillStyle = this.axisColor; |
|
|
|
|
|
ctx.fillText(zLabel, text.x - offset, text.y); |
|
|
|
|
|
|
|
|
xText = (Math.cos(armAngle ) > 0) ? this.xMin : this.xMax; |
|
|
|
|
|
yText = (Math.sin(armAngle ) < 0) ? this.yMin : this.yMax; |
|
|
|
|
|
zText = (this.zMin + this.zMax) / 2; |
|
|
|
|
|
text = new Point3d(xText, yText, zText); |
|
|
|
|
|
|
|
|
|
|
|
this.drawAxisLabelZ(ctx, text, zLabel, offset); |
|
|
} |
|
|
} |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|