看了關(guān)于transform:matrix矩陣與平移translate、縮放scale、旋轉(zhuǎn)rotate、拉伸skew的關(guān)系。對(duì)transform:matrix矩陣與縮放scale的關(guān)系有些不明白。transform: matrix(a,b,c,d,e,f);【提問】1、上述的x、y指的是表示轉(zhuǎn)換元素所在坐標(biāo)變量，這個(gè)所在坐標(biāo)變量是什么意思？是中心點(diǎn)(0，0）嗎？2、矩陣偏移元素的中心點(diǎn)是什么，（0，0）嗎3、transform: matrix(a,b,c,d,e,f);中的a、d是scale();的參數(shù)。例如，按照矩陣的算法就是假設(shè)比例是s，則transform:matrix(s,0,0,s,0,0); 套用矩陣就算，就有：x' = ax+cy+e = s*x+0*y+0 = s*x;y' = bx+dy+f = 0*x+s*y+0 = s*y;但是如果x、y是(0,0)的話，計(jì)算出來(lái)的x'、y'就是(0，0)了，就是進(jìn)行了縮比例。x、y會(huì)是一直都是(0，0)為中心點(diǎn)嗎？還會(huì)有別的值？如果是別的值，是怎么界定了？
1 回答
已采納
pardon110
TA貢獻(xiàn)1038條經(jīng)驗(yàn) 獲得超227個(gè)贊
建議了解一下線性代數(shù)，矩陣相關(guān)高等數(shù)學(xué)概念，運(yùn)算規(guī)則
-
慕容818178不是，我明白矩陣的運(yùn)算規(guī)則。我只是想知道那個(gè)x、y指的是哪個(gè)的值 -
pardon110css3的transform顧名思義是用來(lái)描述變換的，它允許旋轉(zhuǎn)，縮放，傾斜或平移給定元素。其實(shí)際是通過修改CSS視覺格式化模型的坐標(biāo)空間來(lái)實(shí)現(xiàn)的。為了便于理解，你需要知道2D與3D坐標(biāo)系統(tǒng)表示與變換。 先了解一下2D空間坐標(biāo)系：笛卡爾坐標(biāo)用來(lái)描述轉(zhuǎn)換坐標(biāo)模型 在笛卡爾坐標(biāo)系中，每個(gè) 歐氏空間 里的點(diǎn)都由橫坐標(biāo)和縱坐標(biāo)這兩個(gè)值來(lái)確定。 在CSS（和大部分的計(jì)算機(jī)圖形學(xué)）中，原點(diǎn) (0, 0) 在元素的左上角。每個(gè)點(diǎn)都使用數(shù)學(xué)上的向量符號(hào)(x,y)來(lái)描述。對(duì)坐標(biāo)系中的每個(gè)點(diǎn)進(jìn)行矩陣乘法就可以得到變換的效果。基于此，可以描述大部分常見的變換并因此可以將他們組合起來(lái)，如：旋轉(zhuǎn)、縮放或拉伸。組合的變換是從右到左生效，而對(duì)于非線性變換位移，通常是采用位移向量 (tx, ty) 單獨(dú)表示，作為兩個(gè)附加參數(shù)。 好了進(jìn)入3D圖形坐標(biāo)，只說(shuō)matrix函數(shù) CSS 函數(shù) matrix() 用六個(gè)指定的值來(lái)指定一個(gè)均勻的二維（2D）變換矩陣。這個(gè)矩形中的常量值是不作為參數(shù)進(jìn)行傳遞的，其他的參數(shù)則在主要列的順序中描述。 matrix(a, b, c, d, tx, ty) 是 matrix3d(a, b, 0, 0, c, d, 0, 0, 0, 0, 1, 0, tx, ty, 0, 1) 的簡(jiǎn)寫。 a b c d 以 <number> 的格式來(lái)描述線性變換 tx ty 以 <number> 的格式來(lái)描述變換的量 注意：css中的原點(diǎn)是元素左上角頂點(diǎn)（0，0），而不是視窗中心點(diǎn)
-
慕容818178好的謝謝你哦。小提議：下次回答可以換一下行哦，新手理解有點(diǎn)費(fèi)勁，看著也有點(diǎn)費(fèi)勁。
點(diǎn)擊展開后面1條
添加回答
舉報(bào)
0/150
提交
取消