Skip to content

Point4d.js

Jump to bottom
Travis CI User edited this page Sep 24, 2018 · 1 revision

Members

X ⇒ number
Y ⇒ number
Z ⇒ number
XY ⇒ Array.<number>
XYZ ⇒ Array.<number>

Functions

matrix(M) ⇒ Point4d

Return a transformed point using a 2d (3x3 homogenous) matrix. z coordinate remains unchanged.

matrix3d(M) ⇒ Point4d

returns a transformed point using a 3d (4x4 homogenous) matrix

perspective(d) ⇒ Point4d

returns a transformed point like CSS 'transform: perspective(d)' does

rotate(a) ⇒ Point4d

transforms point like CSS 'transform: rotate(a)' does

rotate3d(x, y, z, a) ⇒ Point4d

transforms point like CSS 'transform: rotate3d(x, y, z, a)' does

rotateX(a) ⇒ Point4d

transforms point like CSS 'transform: rotateX(a)' does

rotateY(a) ⇒ Point4d

transforms point like CSS 'transform: rotateY(a)' does

rotateZ(a) ⇒ Point4d

transforms point like CSS 'transform: rotateZ(a)' does

scale(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: scale(x, y)' does

scale3d(x, y, z) ⇒ Point4d

transforms point like CSS 'transform: scale3d(x, y, z)' does

scaleX(s) ⇒ Point4d

transforms point like CSS 'transform: scaleX(s)' does

scaleY(s) ⇒ Point4d

transforms point like CSS 'transform: scaleY(s)' does

scaleZ(s) ⇒ Point4d

transforms point like CSS 'transform: scaleZ(s)' does

skew(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: skew(x, y)' does

skewX(a) ⇒ Point4d

transforms point like CSS 'transform: skewX(a)' does

skewY(a) ⇒ Point4d

transforms point like CSS 'transform: skewY(a)' does

translate(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: translate(x, y)' does

translate3d(x, y, z) ⇒ Point4d

transforms point like CSS 'transform: translate3d(x, y, z)' does

translateX(t) ⇒ Point4d

transforms point like CSS 'transform: translateX(t)' does

translateY(t) ⇒ Point4d

transforms point like CSS 'transform: translateY(t)' does

translateZ(t) ⇒ Point4d

transforms point like CSS 'transform: translateZ(t)' does

X ⇒ number

Kind: global variable
Returns: number - cartesian x-coordinate
Example

new Point4d(1, 2, 3, 4).X //is 0.25

Y ⇒ number

Kind: global variable
Returns: number - cartesian y-coordinate
Example

new Point4d(1, 2, 3, 4).Y //is 0.5

Z ⇒ number

Kind: global variable
Returns: number - cartesian z-coordinate
Example

new Point4d(1, 2, 3, 4).Z //is 0.75

XY ⇒ Array.<number>

Kind: global variable
Returns: Array.<number> - cartesian x- and y-coordinates
Example

new Point4d(1, 2, 3, 4).XY //is equal to [0.25, 0.5]

XYZ ⇒ Array.<number>

Kind: global variable
Returns: Array.<number> - cartesian x-, y- and z-coordinates
Example

new Point4d(1, 2, 3, 4).XYZ //is equal to [0.25, 0.5, 0.75]

matrix(M) ⇒ Point4d

Return a transformed point using a 2d (3x3 homogenous) matrix. z coordinate remains unchanged.

Kind: global function
Returns: Point4d - changed Point4d

Param Type Description
M Array.<number> 3x3 homogenous transformation matrix

Example

const M = [
      [0, 1, 0],
      [0, 1, 0],
      [0, 0, 1]
  ];
  new Point4d(1, 2).matrix(M).XY //is equal to [2, 2]

matrix3d(M) ⇒ Point4d

returns a transformed point using a 3d (4x4 homogenous) matrix

Kind: global function
Returns: Point4d - changed Point4d

Param Type Description
M Array.<number> 4x4 homogenous transformation matrix

Example

const M = [
      [0, 1, 0, 0],
      [0, 0, 1, 0],
      [0, 0, 1, 0],
      [0, 0, 0, 1]
  ];
  new Point4d(1, 2, 3).matrix3d(M).XYZ //is equal to [2, 3, 3]

perspective(d) ⇒ Point4d

returns a transformed point like CSS 'transform: perspective(d)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IIQUqD

Param Type Description
d Number Distance from the user to the z=0 plane. If it is 0 or a negative value, no perspective transform is applied. In px.

Example

new Point4d(2, 2, 2, 2).perspective(2).t //is 1
  new Point4d(2, 2).perspective(-2).t //is 1

rotate(a) ⇒ Point4d

transforms point like CSS 'transform: rotate(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IJlqRh

Param Type Description
a Number Angle of the rotation. A positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In deg.

Example

new Point4d(1, 0).rotate(90).XY //is equal to [0, 1]

rotate3d(x, y, z, a) ⇒ Point4d

transforms point like CSS 'transform: rotate3d(x, y, z, a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2s5Wt89

Param Type Description
x Number x-coordinate of the vector denoting the axis of rotation which could between 0 and 1.
y Number y-coordinate of the vector denoting the axis of rotation which could between 0 and 1.
z Number z-coordinate of the vector denoting the axis of rotation which could between 0 and 1.
a Number angle of the rotation. A positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In deg.

Example

new Point4d(-1, -1, 0).rotate3d(0, 1, 0, 90).XYZ
  //is equal to [0, -1, -1]

rotateX(a) ⇒ Point4d

transforms point like CSS 'transform: rotateX(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2x6ZhqF

Param Type Description
a Number Angle of the rotation. A positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In deg.

Example

new Point4d(0, -1).rotateX(180).XY //is equal to [0, 1]

rotateY(a) ⇒ Point4d

transforms point like CSS 'transform: rotateY(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2KQt6xx

Param Type Description
a Number Angle of the rotation. A positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In deg.

Example

new Point4d(-1, 0).rotateY(180).XY //is equal to [1, 0]

rotateZ(a) ⇒ Point4d

transforms point like CSS 'transform: rotateZ(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2KTCkcD

Param Type Description
a Number Angle of the rotation. A positive angle denotes a clockwise rotation, a negative angle a counter-clockwise one. In deg.

Example

new Point4d(1, 0).rotate(90).XY //is equal to [0, 1]

scale(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: scale(x, y)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IMSlAu
Todo

  • didn't test ES6 version yet. test.
Param Type Default Description
x Number abscissa of the scaling vector
[y] Number x Ordinate of the scaling vector. If not defined, its default value is x, resulting in a uniform scaling that preserves the element's aspect ratio.

Example

new Point4d(1, 2).scale(3, 4).XY //is equal to [3, 8]

Example

new Point4d(1, 2).scale(3).XY //is equal to [3, 6]

scale3d(x, y, z) ⇒ Point4d

transforms point like CSS 'transform: scale3d(x, y, z)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IJ2MVC

Param Type Description
x Number abscissa of the scaling vector
y Number ordinate of the scaling vector
z Number z-component of the scaling vector

Example

new Point4d(1, 2, 3).scale3d(6, 5, 4).XYZ
  //is equal to [6, 10, 12]

scaleX(s) ⇒ Point4d

transforms point like CSS 'transform: scaleX(s)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2kp9HZC

Param Type Description
s Number scaling factor to apply on the abscissa of each point of the element

Example

new Point4d(1, 2).scaleX(3).XY //is equal to [3, 2]

scaleY(s) ⇒ Point4d

transforms point like CSS 'transform: scaleY(s)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2J0TAzc

Param Type Description
s Number scaling factor to apply on the ordinate of each point of the element

Example

new Point4d(1, 2).scaleY(3).XY //is equal to [1, 6]

scaleZ(s) ⇒ Point4d

transforms point like CSS 'transform: scaleZ(s)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2KRKOB3

Param Type Description
s Number scaling factor to apply on the z-coordinate of each point of the element

Example

new Point4d(1, 2, 3).scaleZ(3).XYZ //is equal to [1, 2, 9]

skew(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: skew(x, y)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2kqeVnQ

Param Type Default Description
x Number Angle to use to distort the element along the abscissa. In deg.
[y] Number 0 Angle to use to distort the element along the ordinate. In deg.

Example

new Point4d(1, 2).skew(45).XY //is equal to [3, 2]
  new Point4d(1, 2).skew(45, -45).XY //is equal to [3, 1]

skewX(a) ⇒ Point4d

transforms point like CSS 'transform: skewX(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2xcKtXq

Param Type Description
a Number Angle to use to distort the element along the abscissa. In deg.

Example

new Point4d(1, 2).skewX(45).X //is 3

skewY(a) ⇒ Point4d

transforms point like CSS 'transform: skewY(a)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2sgggBM

Param Type Description
a Number Angle to use to distort the element along the ordinate. In deg.

Example

new Point4d(1, 2).skewY(45).XY //is equal to [1, 3]

translate(x, [y]) ⇒ Point4d

transforms point like CSS 'transform: translate(x, y)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IGzx9Q

Param Type Default Description
x Number Abscissa of the translating vector. In px.
[y] Number 0 Ordinate of the translating vector. In px.

Example

new Point4d(1, 2).translate(-2).XY //is equal to [-1, 2]
  new Point4d(1, 2).translate(-2, 3).XY //is equal to [-1, 5]

translate3d(x, y, z) ⇒ Point4d

transforms point like CSS 'transform: translate3d(x, y, z)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2s5K6ZE

Param Type Description
x Number Abscissa of the translating vector. In px.
y Number Ordinate of the translating vector. In px.
z Number z-component of the translating vector. In px.

Example

new Point4d(1, 2, 3).translate3d(-3, -2, -1).XYZ
  //is equal to [-2, 0, 2]

translateX(t) ⇒ Point4d

transforms point like CSS 'transform: translateX(t)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2IL1kGm

Param Type Description
t Number Abscissa of the translating vector. In px.

Example

new Point4d(1, 2).translateX(-2).X //is -1

translateY(t) ⇒ Point4d

transforms point like CSS 'transform: translateY(t)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2GOb0tH

Param Type Description
t Number Ordinate of the translating vector. In px.

Example

new Point4d(1, 2).translateY(-2).XY //is equal to [1, 0]

translateZ(t) ⇒ Point4d

transforms point like CSS 'transform: translateZ(t)' does

Kind: global function
Returns: Point4d - changed Point4d
See: https://mzl.la/2JeSLD3

Param Type Description
t Number z-component of the translating vector. A positive value moves the element towards the viewer, and a negative value further away.

Example

new Point4d(1, 2, 3).translateZ(-2).XYZ //is equal to [1, 2, 1]

Attention: don't edit these files directly! They are auto-generated and pushed by Travis CI. Add your changes in the jsdoc comments in the code files.

Clone this wiki locally