SVG/transform/matrix：修訂版本之間的差異
出自六年制學程
（→矩陣基本演算規則） |
（→旋轉） |
||
| 第 40 行： | 第 40 行： | ||
</td> | </td> | ||
</tr></table> | </tr></table> | ||
| + | ====縮放==== | ||
| + | <table style='border:none;'><tr> | ||
| + | <td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>S<sub>x</sub> 0<br/>0 S<sub>y</sub></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>S<sub>x</sub>x<br/>S<sub>y</sub>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td> | ||
| + | </tr></table> | ||
| + | ====x拉斜==== | ||
| + | <table style='border:none;'><tr> | ||
| + | <td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>1 k<br/>0 1</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x+ky<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td> | ||
| + | </tr></table> | ||
| + | ====y拉斜==== | ||
| + | <table style='border:none;'><tr> | ||
| + | <td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>1 0<br/>k 1</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y+kx</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td> | ||
| + | </tr></table> | ||
| + | ====沿經過原點的直線反射==== | ||
| + | 假設（ux, uy）為直線方向的單位向量。變換矩陣為： | ||
| + | <table style='border:none;'><tr> | ||
| + | <td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>2u<sub>x</sub><sup>2</sup>-1 2u<sub>x</sub>u<sub>y</sub><br/>2u<sub>x</sub>u<sub>y</sub> 2u<sub>y</sub><sup>2</sup>-1</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>(2u<sub>x</sub><sup>2</sup>-1)x+2u<sub>x</sub>u<sub>y</sub>y<br/>2u<sub>x</sub>u<sub>y</sub>x+(2u<sub>y</sub><sup>2</sup>-1)y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td> | ||
| + | </tr></table> | ||
| + | ====沿直線 y=(tanθ)x 進行反射==== | ||
| + | <table style='border:none;'><tr> | ||
| + | <td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>cos2θ sin2θ<br/>sin2θ -cos2θ</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<br/>y</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>cos2θx+sin2θy<br/>sin2θx-cos2θy</th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td><td>=</td><td> | ||
| + | <table style='border:none;'> | ||
| + | <tr><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-left:solid 1px;'></th><th style=''>x<sup>'</sup><br/>y<sup>'</sup></th><th style='width:2px;border-top:solid 1px;border-bottom:solid 1px;border-right:solid 1px;'></th></tr> | ||
| + | </table> | ||
| + | </td> | ||
| + | </tr></table> | ||
| + | ====投影到一條經過原點的直線==== | ||
==SVG transform 矩陣變換== | ==SVG transform 矩陣變換== | ||
2017年12月14日 (四) 07:52的最新修訂版本
目錄
矩陣基本演算規則
|
| = |
| = |
|
旋轉
|
| = |
| = |
|
縮放
|
| = |
| = |
|
x拉斜
|
| = |
| = |
|
y拉斜
|
| = |
| = |
|
沿經過原點的直線反射
假設（ux, uy）為直線方向的單位向量。變換矩陣為：
|
| = |
| = |
|
沿直線 y=(tanθ)x 進行反射
|
| = |
| = |
|
投影到一條經過原點的直線
SVG transform 矩陣變換
(○)基本
|
| = |
| = |
|
