Added new projection code, using more mathematically correct projection angle rather than ratio.

This commit is contained in:
lewster32
2014-08-23 14:25:57 +01:00
parent b82d2fb7af
commit 01819fe31b
4 changed files with 128 additions and 33 deletions
+67 -16
View File
@@ -53,7 +53,7 @@ Phaser.Plugin.Isometric = function (game, parent) {
Phaser.Plugin.Isometric.prototype = Object.create(Phaser.Plugin.prototype);
Phaser.Plugin.Isometric.prototype.constructor = Phaser.Plugin.Isometric;
Phaser.Plugin.Isometric.VERSION = '0.8.0';
Phaser.Plugin.Isometric.VERSION = '0.8.1';
// Directional consts
Phaser.Plugin.Isometric.UP = 0;
@@ -66,10 +66,6 @@ Phaser.Plugin.Isometric.BACKWARDY = 5;
// Type consts
Phaser.Plugin.Isometric.ISOSPRITE = 'isosprite';
Phaser.Plugin.Isometric.ISOARCADE = 'isoarcade';
// Projection angles
Phaser.Plugin.Isometric.CLASSIC = 0.5;
Phaser.Plugin.Isometric.TRUE = 0.6154797093263624;
;/**
* @class Phaser.Plugin.Isometric.Cube
*
@@ -1701,10 +1697,10 @@ Phaser.Plugin.Isometric.Point3.equals = function (a, b) {
*
* @constructor
* @param {Phaser.Game} game - The current game object.
* @param {number} projectionRatio - The ratio of the axonometric projection.
* @param {number} projectionAngle - The angle of the axonometric projection in radians. Defaults to approx. 0.4636476 (Math.atan(0.5) which is suitable for 2:1 pixel art dimetric)
* @return {Phaser.Plugin.Isometric.Cube} This Cube object.
*/
Phaser.Plugin.Isometric.Projector = function (game, projectionRatio) {
Phaser.Plugin.Isometric.Projector = function (game, projectionAngle) {
/**
* @property {Phaser.Game} game - The current game object.
@@ -1712,18 +1708,36 @@ Phaser.Plugin.Isometric.Projector = function (game, projectionRatio) {
this.game = game;
/**
* @property {number} projectionRatio - The ratio of the axonometric projection.
* @property {array} _transform - The pre-calculated axonometric transformation values.
* @private
*/
this._transform = null;
/**
* @property {number} _projectionAngle - The cached angle of projection in radians.
* @private
*/
this._projectionAngle = 0;
/**
* @property {number} projectionAngle - The angle of projection in radians.
* @default
*/
this.projectionRatio = projectionRatio || Phaser.Plugin.Isometric.CLASSIC;
this.projectionAngle = projectionAngle || Phaser.Plugin.Isometric.CLASSIC;
/**
* @property {Phaser.Point} anchor - The x and y offset multipliers as a ratio of the game world size.
* @default
*/
this.anchor = new Phaser.Point(0.5, 0);
};
// Projection angles
Phaser.Plugin.Isometric.CLASSIC = Math.atan(0.5);
Phaser.Plugin.Isometric.TRUE = Math.PI / 6;
Phaser.Plugin.Isometric.Projector.prototype = {
/**
@@ -1738,9 +1752,8 @@ Phaser.Plugin.Isometric.Projector.prototype = {
out = new Phaser.Point();
}
out.x = point3.x - point3.y;
out.y = ((point3.x + point3.y) * this.projectionRatio) - point3.z;
out.x = (point3.x * this._transform[0][0]) + (point3.y * this._transform[1][0]);
out.y = (point3.x * this._transform[0][1]) + (point3.y * this._transform[1][1]) - point3.z;
out.x += this.game.world.width * this.anchor.x;
out.y += this.game.world.height * this.anchor.y;
@@ -1760,9 +1773,8 @@ Phaser.Plugin.Isometric.Projector.prototype = {
out = new Phaser.Point();
}
out.x = point3.x - point3.y;
out.y = ((point3.x + point3.y) * this.projectionRatio);
out.x = (point3.x * this._transform[0][0]) + (point3.y * this._transform[1][0]);
out.y = (point3.x * this._transform[0][1]) + (point3.y * this._transform[1][1]);
out.x += this.game.world.width * this.anchor.x;
out.y += this.game.world.height * this.anchor.y;
@@ -1770,6 +1782,14 @@ Phaser.Plugin.Isometric.Projector.prototype = {
return out;
},
/**
* Use reverse axonometric projection to transform a 2D Point coordinate to a 3D Point3 coordinate. If given the coordinates will be set into the object, otherwise a brand new Point3 object will be created and returned.
* @method Phaser.Plugin.Isometric.Projector#unproject
* @param {Phaser.Plugin.Isometric.Point} point - The Point to project from.
* @param {Phaser.Point3} out - The Point3 to project to.
* @param {number} offsetY - Offset of the Y axis in screen space, to account for differing z heights.
* @return {Phaser.Point3} The transformed Point3.
*/
unproject: function (point, out, offsetY) {
if (typeof out === "undefined") {
out = new Phaser.Point3();
@@ -1874,7 +1894,38 @@ Phaser.Plugin.Isometric.Projector.prototype = {
}
};
;/**
/**
* @name Phaser.Plugin.Isometric.Projector#projectionAngle
* @property {number} projectionAngle - The angle of axonometric projection.
*/
Object.defineProperty(Phaser.Plugin.Isometric.Projector.prototype, "projectionAngle", {
get: function () {
return this._projectionAngle;
},
set: function (value) {
if (value === this._projectionAngle) {
return;
}
this._projectionAngle = value;
this._transform = [
[
Math.cos(this._projectionAngle),
Math.sin(this._projectionAngle)
],
[
Math.cos(Math.PI - this._projectionAngle),
Math.sin(Math.PI - this._projectionAngle)
]
];
}
});;/**
* @class Phaser.Plugin.Isometric.Body
*
* @classdesc
File diff suppressed because one or more lines are too long
-4
View File
@@ -66,7 +66,3 @@ Phaser.Plugin.Isometric.BACKWARDY = 5;
// Type consts
Phaser.Plugin.Isometric.ISOSPRITE = 'isosprite';
Phaser.Plugin.Isometric.ISOARCADE = 'isoarcade';
// Projection angles
Phaser.Plugin.Isometric.CLASSIC = 0.5;
Phaser.Plugin.Isometric.TRUE = 0.6154797093263624;
+58 -10
View File
@@ -6,10 +6,10 @@
*
* @constructor
* @param {Phaser.Game} game - The current game object.
* @param {number} projectionRatio - The ratio of the axonometric projection.
* @param {number} projectionAngle - The angle of the axonometric projection in radians. Defaults to approx. 0.4636476 (Math.atan(0.5) which is suitable for 2:1 pixel art dimetric)
* @return {Phaser.Plugin.Isometric.Cube} This Cube object.
*/
Phaser.Plugin.Isometric.Projector = function (game, projectionRatio) {
Phaser.Plugin.Isometric.Projector = function (game, projectionAngle) {
/**
* @property {Phaser.Game} game - The current game object.
@@ -17,18 +17,36 @@ Phaser.Plugin.Isometric.Projector = function (game, projectionRatio) {
this.game = game;
/**
* @property {number} projectionRatio - The ratio of the axonometric projection.
* @property {array} _transform - The pre-calculated axonometric transformation values.
* @private
*/
this._transform = null;
/**
* @property {number} _projectionAngle - The cached angle of projection in radians.
* @private
*/
this._projectionAngle = 0;
/**
* @property {number} projectionAngle - The angle of projection in radians.
* @default
*/
this.projectionRatio = projectionRatio || Phaser.Plugin.Isometric.CLASSIC;
this.projectionAngle = projectionAngle || Phaser.Plugin.Isometric.CLASSIC;
/**
* @property {Phaser.Point} anchor - The x and y offset multipliers as a ratio of the game world size.
* @default
*/
this.anchor = new Phaser.Point(0.5, 0);
};
// Projection angles
Phaser.Plugin.Isometric.CLASSIC = Math.atan(0.5);
Phaser.Plugin.Isometric.TRUE = Math.PI / 6;
Phaser.Plugin.Isometric.Projector.prototype = {
/**
@@ -43,9 +61,8 @@ Phaser.Plugin.Isometric.Projector.prototype = {
out = new Phaser.Point();
}
out.x = point3.x - point3.y;
out.y = ((point3.x + point3.y) * this.projectionRatio) - point3.z;
out.x = (point3.x * this._transform[0][0]) + (point3.y * this._transform[1][0]);
out.y = (point3.x * this._transform[0][1]) + (point3.y * this._transform[1][1]) - point3.z;
out.x += this.game.world.width * this.anchor.x;
out.y += this.game.world.height * this.anchor.y;
@@ -65,9 +82,8 @@ Phaser.Plugin.Isometric.Projector.prototype = {
out = new Phaser.Point();
}
out.x = point3.x - point3.y;
out.y = ((point3.x + point3.y) * this.projectionRatio);
out.x = (point3.x * this._transform[0][0]) + (point3.y * this._transform[1][0]);
out.y = (point3.x * this._transform[0][1]) + (point3.y * this._transform[1][1]);
out.x += this.game.world.width * this.anchor.x;
out.y += this.game.world.height * this.anchor.y;
@@ -187,3 +203,35 @@ Phaser.Plugin.Isometric.Projector.prototype = {
}
};
/**
* @name Phaser.Plugin.Isometric.Projector#projectionAngle
* @property {number} projectionAngle - The angle of axonometric projection.
*/
Object.defineProperty(Phaser.Plugin.Isometric.Projector.prototype, "projectionAngle", {
get: function () {
return this._projectionAngle;
},
set: function (value) {
if (value === this._projectionAngle) {
return;
}
this._projectionAngle = value;
this._transform = [
[
Math.cos(this._projectionAngle),
Math.sin(this._projectionAngle)
],
[
Math.cos(Math.PI - this._projectionAngle),
Math.sin(Math.PI - this._projectionAngle)
]
];
}
});