svg.js中实现的svg viewbox问题/错误

我正在使用html和svg.js库将svg图形写入屏幕。当我应用一个viewbox时，我会得到一个我不理解也无法解决的奇怪行为。工作代码和非工作代码之间的代码差异如下：

工作代码：

//Works great
svg = SVG(document.getElementsByTagName("div")[0]);
draw = svg  //.viewbox(0, 0, 300, 300)

破产：

//XY coordinates are off weird amounts
svag = SVG(document.getElementsByTagName("div")[0]);
draw = svg.viewbox(0, 0, 300, 300) //adding view box causes the problem

实施：

function drawRect(e) {
    var rectX = e.clientX;
    var rectY = e.clientY;
    draw.rect(10,10).move(rectX, rectY).fill("#00FF00")

损坏/工作：

请原谅我在这里的笨拙。。绿色方块是关闭的，离点（0,0）越远，关闭的次数越多。“关”的意思是绿色方块不会出现在点击发生的地方。由于某种原因

我想知道如何调整viewbox的代码：

---

可能相关：

通过where（SVG.handlerMap[0]==

通过SVG变换点，您必须将鼠标坐标转换为SVG的坐标系。您可以使用
点（）
方法：

p = draw.point(e.clientX, e.clientY)
draw.rect(10,10).center(p.x, p.y).fill("#00FF00")

e对象有其他属性，但所有属性都显示相同的坐标。添加viewBox会应用变换，因为内容现在正在缩放以适应视口（页面上SVG的大小）。它们不再是1:1。因此，这意味着SVG坐标中（100100）的位置可能不再是（100100）在页面上。您现在必须将鼠标坐标转换为SVG坐标。要在SVG.js中实现这一点，请使用函数。正如Fuzzyma所说。
p = draw.point(e.clientX, e.clientY)
draw.rect(10,10).center(p.x, p.y).fill("#00FF00")