0

我一般是 SVG.js 和 javascript 的新手,我正在查看这里的文档http://documentup.com/wout/svg.js#usage/svg-document并且遇到了一些问题。

Usage

Create a SVG document

Use the SVG() function to create a SVG document within a given html element:
var draw = SVG('drawing').size(300, 300)
var rect = draw.rect(100, 100).attr({ fill: '#f06' })

所以我假设他们希望我们调用一个函数,所以我从 Three.js 中的一些混乱中收集到的是我需要做的

<script>
function SVG()
{
          //Use the SVG() function to create a SVG document within a given html             

        var draw = SVG('drawing').size(300, 300)
        var rect = draw.rect(100, 100).attr({ fill: '#f06' })
}
</script>

在正文标签内。然而,这不起作用。当调用 SVG(); 我收到一个错误

Uncaught RangeError: Maximum call stack size exceeded (15:22:47:898 | error, javascript)
at SVG (:18:13)
at SVG (:20:12)
at SVG (:20:12)
at SVG (:20:12)
at SVG (:20:12)
at SVG (:20:12)

如前所述,我还有其他方法可以做到这一点,但似乎最简单的方法是调用一个函数,但我再次不确定我是否正确执行此操作。

我有 Java 的背景,刚从 JMonkeyEngine 的项目中走出来,所以我对编程并不陌生,但对我到底需要做什么感到困惑,因为文档非常模糊,似乎暗示你需要了解他们关于将代码放在何处的术语。

我还发现了一些其他库,如 snap.svg、d3 和 raphael

http://d3js.org/

raphaeljs.com/ snapsvg.io/

我真的只是想创建一堆带边框的图片/彩色框(可互换,因此本质上是一个带有图像的框,然后可以关闭并显示为颜色),即使单击和拖动也可以响应鼠标在桌面和移动浏览器上。基本上不多,但似乎这些都具有相似的功能,只是编码感觉不同。

有什么建议吗?

谢谢大家!

4

1 回答 1

0

正如 Nils 所说,这里有一个 Hello World 示例:https ://stackoverflow.com/tags/svg.js/info

您还可以找到大量文档和示例来了解您需要做什么。

//Use the SVG() function to create a SVG document within a given html
var canvas = SVG(idOfElement)
// now an svg was created in the element with the id

// draw a rectangle
canvas.rect(100,100)
于 2018-02-15T14:36:04.730 回答