无法在SVG.js中绘制。可能在.viewBox（）调用中做错了吗？

Question

创建SVG元素：

var draw = SVG('drawing').size(window.innerWidth, window.innerHeight);
draw.viewbox(0, 0, 100, 100);

我认为问题出在那儿。当我尝试稍后在x = 0处绘制点时，

var line = draw.line(0, 0, 100, 100).stroke({ width: 1 })

如下图所示，它向右绘制了40个点。

Answer 1

好，您的viewBox为“ 0 0 100 100”。那是正方形。但是它的容器似乎是oblong。那么如何显示您的图形？

默认情况下，如果指定了viewBox，则将保留长宽比（方形度），这意味着您会在矩形内看到整个绘图区域仍然是正方形，因此矩形的最小边是正方形的大小，并且因此，最长边的任一边都有缝隙。

如果您不希望这样做，可以通过设置preserveAspectRatio property来选择各种替代方法。