SVG <path>

<path> тег используется для определения пути.

<path> тег

<path> тег используется для определения пути.

Следующие команды можно использовать для данных пути:

  • M = moveto
  • L = lineto
  • H = horizontal lineto
  • V = vertical lineto
  • C = curveto
  • S = smooth curveto
  • Q = quadratic Belzier curve
  • T = smooth quadratic Belzier curveto
  • A = elliptical Arc
  • Z = closepath

Комментарий:Все следующие команды позволяют использовать строчные буквы. Буквы с заглавной буквы означают абсолютное положение, а строчные буквы - относительное положение.

Скопируйте следующий код в блокнот, сохраните файл как "path1.svg". Поместите этот файл в вашу веб-директорию:

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">
<path d="M250 150 L150 350 L350 350 Z" />

В предыдущем примере определен путь, который начинается в позиции 250 150, достигает позиции 150 350, затем начинает с 350 350 и в конечном итоге закрывает путь в 250 150.

查看例子

Ниже приведен пример создания спирали:

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100%" height="100%" version="1.1"
xmlns="http://www.w3.org/2000/svg">

查看例子

很复杂吧？是的！！！由于绘制路径的复杂性，因此强烈建议您使用 SVG 编辑器来创建复杂的图形。