Покажем на примере, как могут пригодиться знания, полученные в курсе высшей математики (раздел аналитическая геометрия и матричная алгебра) в векторной svg-графике. Приведем полный код примера:
1.
<
svg
version
=
"1.1"
baseProfile
=
"full"
xmlns
=
"http://www.w3.org/2000/svg"
width
=
"100%"
height
=
"110px"
viewBox
=
"0 -55 300 110"
font-family
=
"Times, serif"
font-size
=
"50px"
>
2.
3.
<
text
x
=
"5"
y
=
"-5"
>PRIMAT.ORG</
text
>
4.
<
line
x1
=
"0"
y1
=
"0"
x2
=
"300"
y2
=
"0"
stroke
=
"red"
stroke-width
=
"1px"
></
line
>
5.
<
text
x
=
"5"
y
=
"-5"
transform
=
"matrix(1,0,0,-1,0,0)"
fill
=
"blue"
>PRIMAT.ORG</
text
>
6.
7.
</
svg
>
matrix(1,0,0,-1,0,0)
Приведем примеры команд и матриц элементарных преобразований:
translate (перемещение на x и y px) — matrix(1,0,0,1,x,y)
rotate (поворот на угол a) — matrix(cos(a),sin(a),-sin(a),cos(a),0,0)
scale (масштабирование с коэффициентами kx и ky) — matrix(kx,0,0,ky,0,0)
skewX (наклон вдоль X на угол a) — matrix(1,0,tg(a),1,0,0)
skewY (наклон вдоль Y на угол a) — matrix(1,tg(a),0,1,0,0)
тождественное преобразование — matrix(1,0,0,1,0,0)
Похожие публикации
2016-03-25 • Просмотров [ 1747 ]