svg-path-d
Version:
SVG path data (path[d] attribute content) manipulation library.
139 lines • 5.03 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.decompose = exports.toString = exports.toArray = exports.invert = exports.multiply = exports.createRotateAt = exports.createRotate = exports.createSkew = exports.createScaleAt = exports.createScale = exports.createTranslate = exports.createIdentity = exports.isScale = exports.isTranslate = exports.isIdentity = void 0;
function isIdentity(m) {
return m.a === 1 && m.b === 0 && m.c === 0 && m.d === 1 && m.e === 0 && m.f === 0;
}
exports.isIdentity = isIdentity;
function isTranslate(m) {
return m.a === 1 && m.d === 1 && m.b === 0 && m.c === 0;
}
exports.isTranslate = isTranslate;
function isScale(m) {
return m.e === 0 && m.f === 0 && m.b === 0 && m.c === 0;
}
exports.isScale = isScale;
function createIdentity() {
return { a: 1, b: 0, c: 0, d: 1, e: 0, f: 0 };
}
exports.createIdentity = createIdentity;
function createTranslate(x, y) {
return { a: 1, b: 0, c: 0, d: 1, e: x, f: y };
}
exports.createTranslate = createTranslate;
/**
* Creates a scale matrix.
* @param scaleX The amount by which to scale along the x-axis.
* @param scaleY The amount by which to scale along the y-axis.
*/
function createScale(scaleX, scaleY) {
return { a: scaleX, b: 0, c: 0, d: scaleY, e: 0, f: 0 };
}
exports.createScale = createScale;
/**
* Creates a scale about the specified point matrix.
* @param scaleX The amount by which to scale along the x-axis.
* @param scaleY The amount by which to scale along the y-axis.
* @param centerX The x-coordinate of the scale operation's center point.
* @param centerY The y-coordinate of the scale operation's center point.
*/
function createScaleAt(scaleX, scaleY, centerX, centerY) {
// Analog of:
// SVG.transform="translate(cx, cy) scale(sx, sy) translate(-cx, -cy)"
// or
// multiply(
// createTranslate(centerX, centerY),
// multiply(createScale(scaleX, scaleY), createTranslate(-centerX, -centerY))
// );
return { a: scaleX, b: 0, c: 0, d: scaleY, e: centerX * (1 - scaleX), f: centerY * (1 - scaleY) };
}
exports.createScaleAt = createScaleAt;
function createSkew(skewX, skewY) {
return { a: 1, b: Math.tan(skewY), c: Math.tan(skewX), d: 1, e: 0, f: 0 };
}
exports.createSkew = createSkew;
/**
* Creates a rotation matrix.
* @param angle The rotation angle, in radians.
*/
function createRotate(angle) {
return { a: Math.cos(angle), b: Math.sin(angle), c: -Math.sin(angle), d: Math.cos(angle), e: 0, f: 0 };
}
exports.createRotate = createRotate;
/**
* Creates a rotation matrix about the specified point.
* @param angle The angle, in radians, by which to rotate.
* @param centerX The x-coordinate of the point about which to rotate.
* @param centerY The y-coordinate of the point about which to rotate.
*/
function createRotateAt(angle, centerX, centerY) {
// Analog of:
// SVG.transform="translate(cx, cy) rotate(deg) translate(-cx, -cy)"
// or
// multiply(
// createTranslate(centerX, centerY),
// multiply(createRotate(angle), createTranslate(-centerX, -centerY))
// );
var a = Math.cos(angle);
var b = Math.sin(angle);
return { a: a, b: b, c: -b, d: a, e: (1 - a) * centerX + b * centerY, f: (1 - a) * centerY - b * centerX };
}
exports.createRotateAt = createRotateAt;
function multiply(A, B) {
return {
a: A.a * B.a + A.c * B.b,
b: A.b * B.a + A.d * B.b,
c: A.a * B.c + A.c * B.d,
d: A.b * B.c + A.d * B.d,
e: A.a * B.e + A.c * B.f + A.e,
f: A.b * B.e + A.d * B.f + A.f,
};
}
exports.multiply = multiply;
/**
* Returns an inverted version of the matrix.
* @param m the given matrix
*/
function invert(m) {
var x = m.a * m.d - m.b * m.c;
return {
a: m.d / x,
b: -m.b / x,
c: -m.c / x,
d: m.a / x,
e: (m.c * m.f - m.d * m.e) / x,
f: (m.b * m.e - m.a * m.f) / x,
};
}
exports.invert = invert;
function toArray(m) {
return [m.a, m.b, m.c, m.d, m.e, m.f];
}
exports.toArray = toArray;
function toString(m) {
return 'matrix(' + toArray(m).join(', ') + ')';
}
exports.toString = toString;
// from http://math.stackexchange.com/questions/861674/decompose-a-2d-arbitrary-transform-into-only-scaling-and-rotation
function decompose(m) {
var E = (m.a + m.d) / 2;
var F = (m.a - m.d) / 2;
var G = (m.c + m.b) / 2;
var H = (m.c - m.b) / 2;
var Q = Math.sqrt(E * E + H * H);
var R = Math.sqrt(F * F + G * G);
var a1 = Math.atan2(G, F);
var a2 = Math.atan2(H, E);
var theta = (a2 - a1) / 2;
var phi = (a2 + a1) / 2;
return {
translateX: m.e,
translateY: m.f,
rotate: (-phi * 180) / Math.PI,
scaleX: Q + R,
scaleY: Q - R,
skew: (-theta * 180) / Math.PI,
};
}
exports.decompose = decompose;
//# sourceMappingURL=matrix.js.map