我正在开发一个SVG应用程序，现在想让用户使用可拖动的角调整对象的大小，非常类似于SVG-edit（http://svg-edit.googlecode.com/svn/trunk/editor/ SVG-editor.html）。 功能应该如下工作：用户选择一个SVG对象，将其拖动到主'画布'，一旦在'画布'上，对象外部的四个角出现，用户可以拖动每个角点＆安培;拖动以放大对象。对象将是矩形的并使用路径创建，而不是使用SVG'rect'函数。 有人会对如何实施这一点有任何建议吗？ 在此先感谢
答案 0 :(得分：1)
这可以通过将要调整大小的项目包装在g元素中，然后将变换应用于该元素来实现。让我们看一下拖动右下角的简单情况。您需要首先确定g元素的边界框。您可以将mousedown，mousemove，mouseup事件添加到该元素，或使用一些占位符元素（如矩形）作为句柄来拖动以重新调整大小。这里有一个重要的注意事项是，如果你使用小形状进行跟踪，那么必然会发生不好的事情。用户可以很容易地拖动鼠标移出形状，从而取消拖动操作。为了解决这个问题，我通常在整个画布的顶部使用透明的形状，并转换点事件。我在那里注册我的鼠标跟踪事件。这样您就可以跟踪鼠标而不必担心会退出形状。
所以，回到调整大小。您需要将当前位置与新位置进行比较。我可能会使用从左上角到右下角的长度除以你要拖动的左上角和新左下角的长度的比率。现在，您可以构造一个将g元素按比例缩放的变换。但是，这里的事情有点棘手，这可能是你遇到了困难。首先，您需要将左上角转换为原点，然后缩放，然后将原点转换回原点。这将在调整g元素内容的其余部分时调整左上角保留在当前位置的效果。
HTH， 凯文