Differences

This shows you the differences between two versions of the page.

--- works:programmer:html:svg-path [2019/12/04 03:15]
Chugreev Eugene создано
+++ works:programmer:html:svg-path [2019/12/04 03:59] (current)
Chugreev Eugene
@@ Line 1: / Line 1: @@
 ====== SVG Path ======
-Bootstrap :
+Переведено с [[https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Paths|MozDev]]
+===== Bootstrap : =====
 <code html>
 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
@@ Line 7: / Line 9: @@
 </svg>
 </code>
+===== Разница между большими и маленькими буквами =====
+Если буква большая **M 10 10** - то считать надо от позиции 0 0 \\
+Если буква маленькая **m 10 -10** - то считать надо от текущей позиции
-Функции d:
+===== Функции d : =====
 ^ Операция ^ Маска ^ Действия ^ Параметры ^
 | Move To | M %x %y | Переместить курсор на | int %x = позиция X \\ int %y = позиция Y |
@@ Line 15: / Line 20: @@
 | Vertical Line | V %y | Нарисовать вертикальную до | int %y = позиция Y |
 | Close Path | Z | Окончить Path, обычно выставляется в конце | |
-| Cubic Beziers | C %x1 %y1, %x2 %y2, %x %y | Кривая линия | int %x %y = конечная точка (Select anchor points) \\ %x1 %y1 = Тянущая линия ОТ (Adjustment points) \\ %x2 %y2 = Тянущая линия ДО (Adjustment handle) \\ {{works:programmer:html:bezier-curve.jpg?linkonly}} |
+| Cubic Beziers | C %x1 %y1, %x2 %y2, %x %y | Кривая линия | int %x %y = конечная точка (Select anchor points) \\ int %x1 %y1 = Тянущая линия ОТ (Adjustment points) \\ int %x2 %y2 = Тянущая линия ДО (Adjustment handle) \\ {{works:programmer:html:bezier-curve.jpg?linkonly}} |
+| Several Bezier | S %x2 %y2, %x %y | Продолжает Cubic Beziers | int %x %y = конечная точка (Select anchor points) \\ int %x2 %y2 = Тянущая линия ДО (Adjustment handle) |
+| <code html><path d="M 10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80" stroke="black" fill="transparent"/></code> ||| {{works:programmer:html:shortcut_cubic_bezier_with_grid.png}} |
+| Quadratic Curve | Q %x1 %y1, %x %y | Квадратное закругление | int %x %y = конечная точка \\ int %x1 %y1 = Тянущая линия \\ {{works:programmer:html:quadratic_bezier_with_grid.png?linkonly}} |
+| Multiple Quadratic Beziers | T %x %y | Продолжение квадратного закругления (Линия продолжиться отрицательно квадратному закруглению) | int %x %y = конечная точка |
+| <code html><path d="M 10 80 Q 52.5 10, 95 80 T 180 80" stroke="black" fill="transparent"/></code> ||| {{works:programmer:html:shortcut_quadratic_bezier_with_grid.png}} |
+| Arcs | A %rx %ry %x-axis-rotation %large-arc-flag %sweep-flag %x %y | Рисует дугообразные линии | FIXME |

EugeneX MiniWeb

User Tools

Site Tools

Differences

Page Tools