SpecialistOff.NET / Вопросы / Статьи / Фрагменты кода / Резюме / Метки / Помощь / Файлы

Краткий справочник SVG

Метки: svg

Примитивы

Линия

<line x1="0" y1="0" x2="30" y2="0" stroke="black" />

Окружность

<circle cx="0" cy="0" r="5" />

Полигон (многоугольник)

<polygon fill="black" points="0,30 20,40 50,40 30,30 0,30" />

Эллипс

<ellipse rx="50" ry="25" cx="0" cy="0" />

rx - радиус горизонтальной дуги эллипса

ry - радиус вертикальной дуги эллипса

cx - координата X центра эллипса

cy - координата Y центра эллипса

Путь

<path d="M0,0 L10,10" />

• M - координата начала
• L - координата конца отрезка
• H - координата X конца горизонтального отрезка
• V - координата Y конца вертикального отрезка
• A - дуга эллипса
  • rx - радиус горизонтальной дуги
  • ry - радиус вертикальной дуги
  • x-axis-rotation - угол поворота относительно оси X
  • large-arc-flag - внутренняя или внешняя дуга
  • sweep-flag - верхняя или нижняя дуга
  • x y - координаты конца кривой
• Q - квадратичная кривая Безье
• T - гладкая квадратичная кривая Безье
• C - кубическая кривая Безье
• S - гладкая кубическая кривая Безье

Преобразования

transform

matrix

<math display="block"><semantics><mrow><mo>(</mo><mtable rowspacing="0.5ex"><mtr><mtd><mi>a</mi></mtd><mtd><mi>c</mi></mtd><mtd><mi>e</mi></mtd></mtr><mtr><mtd><mi>b</mi></mtd><mtd><mi>d</mi></mtd><mtd><mi>f</mi></mtd></mtr><mtr><mtd><mn>0</mn></mtd><mtd><mn>0</mn></mtd><mtd><mn>1</mn></mtd></mtr></mtable><mo>)</mo></mrow><annotation encoding="TeX">\begin{pmatrix} a &amp; c &amp; e \\ b &amp; d &amp; f \\ 0 &amp; 0 &amp; 1 \end{pmatrix}</annotation></semantics>,</math>