Question

为什么这条路不可见？我使用javascript动态创建路径，但路径在屏幕上不可见，但它存在于DOM中。

var svg = document.getElementById('svg');
var path = document.createElementNS('http://www.w3.org/svg', 'path');
path.setAttribute('d', 'M100,100 L100,100');
path.setAttribute('style', 'stroke:black;fill:none;');
path.setAttribute('matrix', '1,0,0,1,100,100');
svg.appendChild(path);

或JsFiddle

Answer 1

你有两个不同的问题

SVG名称空间实际上是http://www.w3.org/2000/svg
你没有画一条去任何地方的线，它从100,100开始并在同一个地方结束。

Answer 2

您正在创建一个路径，其起点为100,100（由M100,100表示），并绘制一条“线”到该完全相同的点（L100,100），所以你根本就没有画线。

SVG路径区分绝对坐标和相对坐标。使用大写字母表示绝对值。小写字母用于相对坐标值（相对于之前绘制或移动的坐标）。

你应该使用小写字母来表示相对路径：M100,100 l100,100表示从100,100开始并绘制一条线到一个点，在x方向上是100px，在y方向上是100px。

或者你应该使用另一个坐标wholeley，例如：M100,100 L110,110（从100,100开始并在110,110画一条线）。

svg路径不可见

2 个答案: