使用svg.js的代码在JSFiddle.com或我的笔记本电脑中不起作用

Code with svg.js not working in JSFiddle.com or my laptop

本文关键字:我的 笔记本 电脑 不起作用 com JSFiddle js svg 代码 使用      更新时间:2023-09-26

svg.js新手…

我第一次尝试的示例是https://jsfiddle.net/wout/Vac2Q/在OS X上的safari中,单击run只会使结果窗格变白,然后再次变灰。代码在这里。。。

<div id="drawing"></div>
/* create an svg drawing */
var draw = SVG('drawing')
/* draw rectangle */
var rect = draw.rect(50,50).move(100,100).fill('#f09')
/* make rectangle jump and change color on mouse over */
rect.mouseover(function() {
    this.animate(1000, SVG.easing.elastic)
    .move(400 * Math.random(), 400 * Math.random())
    .rotate(-45 + 90 * Math.random())
    .fill({
        r: ~~(Math.random() * 255)
      , g: ~~(Math.random() * 255)
      , b: ~~(Math.random() * 255)
    })
})
/* write text at the back */
draw.text('svg.js playground'ntry to grab the rectangle!')
    .back()
    .fill('#ccc')
    .move('50%', '40%')
    .font({
        family: 'Source Sans Pro'
     , size: 18
     , anchor: 'middle'
    })
/* create clock */
draw.clock('15%').back().start().move('80%', '80%')

然后,在正确链接到源CDN后,我试图在我的笔记本电脑上运行相同的代码,但它失败了,并在OS X上的chrome上出现错误"svg.js:3741 Uncaught TypeError:无法读取null的属性'nodeName'"。

我使用哪种浏览器并不重要。它仍然以相同的错误失败。我试图在div元素下包含sag元素,将"drawing"设置为sag元素的id来代替div元素等,但无济于事。

这里发生了什么?这是svg.js中的一个错误吗?

我删除了时钟,因为它不适用于最新的svg.js版本。这是一把经过校正的小提琴:https://jsfiddle.net/Vac2Q/6486/

这里有一些代码,这样我就可以提交答案

see my code here ;)