Незакрытый путь SVG закрыт

Я пишу кое-что с d3, и я столкнулся с причудливой проблемой. Пути, которые закрыты с символом "Z", но каждый путь, который я делаю, закрывает (и заполняет) независимо от того, включаю ли я Z или нет. Даже в изоляции с примерами, скопированными из спецификации, это происходит. Например:

<svg>
    <path d="M 40 60 L 10 60 L 40 42.68 M 60 60 L 90 60 L 60 42.68"/>
</svg>

Я озадачен тем, что может быть проблемой. Я был бы признателен за любую проницательность.

Ответы

Ответ 1

Соответствующая строка из спецификации SVG, касающаяся путей заполнения:

Операция заполнения заполняет открытые подпуты, выполняя операцию заполнения, как если бы добавлена ​​дополнительная команда "closepath", чтобы связать последнюю точку подпути с первой точкой подпути.

Итак, что касается fill, там подразумевается "Z" в конце. Однако для штриха не подразумевается закрытие, поэтому он не будет нарисовать штрих, соединяющий последнюю точку с первой точкой, если вы явно не добавите "Z".

Если вы хотите применить штрих, используйте CSS для отключения заполнения:

path {
  fill: none;
  stroke: #000;
  stroke-width: 1.5px;
}

(Я вижу, вы ответили на свой вопрос, но я думал, что другие могут найти полезное объяснение.)

Ответ 2

Я проголосовал за ответ, но иногда css не является вариантом, когда вы пытаетесь преобразовать SVG в холст и хотите, чтобы путь svg не был заполнен или закрыт. Эквивалентно решению css, но без css...

<svg fill="white" fill-opacity="0" stroke="#000" stroke-width="1.5">
    <path d="M 40 60 L 10 60 L 40 42.68 M 60 60 L 90 60 L 60 42.68"/>
</svg>