{"id":16858031,"url":"https://github.com/leeoniya/transformation-matrix-js","last_synced_at":"2026-02-02T10:06:11.043Z","repository":{"id":23119335,"uuid":"26473891","full_name":"leeoniya/transformation-matrix-js","owner":"leeoniya","description":"An implementation of a 2D transformation matrix for JavaScript.","archived":false,"fork":false,"pushed_at":"2019-03-28T20:15:17.000Z","size":332,"stargazers_count":59,"open_issues_count":0,"forks_count":9,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-18T12:15:56.909Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":null,"has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/leeoniya.png","metadata":{"files":{"readme":"readme.md","changelog":"Change.log","contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-11-11T07:14:39.000Z","updated_at":"2025-02-07T21:05:15.000Z","dependencies_parsed_at":"2022-08-21T19:30:20.303Z","dependency_job_id":null,"html_url":"https://github.com/leeoniya/transformation-matrix-js","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/leeoniya/transformation-matrix-js","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leeoniya%2Ftransformation-matrix-js","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leeoniya%2Ftransformation-matrix-js/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leeoniya%2Ftransformation-matrix-js/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leeoniya%2Ftransformation-matrix-js/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/leeoniya","download_url":"https://codeload.github.com/leeoniya/transformation-matrix-js/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/leeoniya%2Ftransformation-matrix-js/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259518830,"owners_count":22870303,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-13T14:11:16.106Z","updated_at":"2026-02-02T10:06:06.024Z","avatar_url":"https://github.com/leeoniya.png","language":null,"funding_links":[],"categories":[],"sub_categories":[],"readme":"2D Affine Transformation Matrix\n-------------------------------\n\nA affine transformation matrix (3x3) class for JavaScript that performs\nvarious transformations such as rotate, scale, translate, skew, add, subtract\nand multiply.\n\nIt's intended for situations where you need to track or create transforms\nand want to apply it permanently/manually to your own points.\n\nThe matrix can optionally synchronize a canvas 2D context object so the transformations\non the canvas matches pixel perfect the local transformations of the Matrix object.\n\nNo dependencies.\n\n\nUsage\n-----\n\nJust include the script and create a new instance like:\n\n    var matrix = new Matrix([context]);\n\nYou can supply an optional context as argument which in case will be\nsynchronized with the transformations that are applied to the matrix\nobject.\n\nYou can now apply transformations:\n\n    matrix.rotate(angle);    \t\t        // angle in radians\n    matrix.rotateDeg(angle);   \t\t        // angle in degrees\n    matrix.translate(x, y);\n    matrix.translateX(x);\n    matrix.translateY(y);\n    matrix.scale(sx, sy);\n    matrix.scaleX(sx);\n    matrix.scaleY(sy);\n    matrix.skew(sx, sy);\n    matrix.skewX(sx);\n    matrix.skewY(sy);\n    matrix.transform(a, b, c, d, e, f);\n    matrix.setTransform(a, b, c, d, e, f);\n\tmatrix.reset();\n\nGet current transform matrix values:\n\n    var a = matrix.a;\t// scale x\n    var b = matrix.b;\t// skew y\n    var c = matrix.c;\t// skew x\n    var d = matrix.d;\t// scale y\n    var e = matrix.e;\t// translate x\n    var f = matrix.f;\t// translate y\n\nApply to a point:\n\n    var tPoint = matrix.applyToPoint(x, y);\n\nApply to an Array with point objects or point pair values:\n\n    var tPoints = matrix.applyToArray([{x: x1, y: y1}, {x: x2, y: y2}, ...]);\n    var tPoints = matrix.applyToArray([x1, y1, x2, y2, ...]);\n    var tPoints = matrix.applyToTypedArray(...);\n\nor apply to a canvas context (other than optionally referenced in constructor):\n\n    matrix.applyToContext(myContext);\n\nGet inverse transformation matrix (the matrix you need to apply to get back\nto a identity matrix from whatever the matrix contains):\n\n    var invmatrix = matrix.getInverse();\n\nYou can interpolate between current and a new matrix. The function\nreturns a new matrix:\n\n    var imatrix = matrix.interpolate(matrix2, t);  // t = [0.0, 1.0]\n\nCheck if there is any transforms applied:\n\n    var status = matrix.isIdentity();              // true if identity\n\nCheck if two matrices are identical:\n\n    var status = matrix.isEqual(matrix2);          // true if equal\n\nReset matrix to an identity matrix:\n\n    matrix.reset();\n\nMethods are also chain-able:\n\n    matrix.rotateDeg(45).translate(100, 120);     // rotate, then translate\n\nSee documentation for full overview and usage.\n\n\nLicense\n-------\n\nReleased under [MIT license](http://choosealicense.com/licenses/mit/). You can use this class in both commercial and non-commercial projects provided that full header (minified and developer versions) is included.\n\n*\u0026copy; 2014 Epistmex*\n\n![Epistemex](http://i.imgur.com/YxO8CtB.png)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleeoniya%2Ftransformation-matrix-js","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fleeoniya%2Ftransformation-matrix-js","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fleeoniya%2Ftransformation-matrix-js/lists"}