新手svg.js ...
我首先在OS X上的safari中尝试了https://jsfiddle.net/wout/Vac2Q/处提供的示例,然后单击“仅运行”使结果窗格变为白色,然后再次变为灰色。代码就在这里......
<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后在我的笔记本电脑上运行相同的代码,但它失败并出现错误&#34; svg.js:3741 Uncaught TypeError:无法读取属性&#39; nodeName&#39; of null&#34; on OS X上的chrome。
使用哪种浏览器并不重要。它仍然失败并出现同样的错误。我试图在div元素下包含sag元素,设置&#39; drawing&#39;作为sag元素的id代替div元素等,但没有帮助。
这里发生了什么?这是svg.js中的错误吗?
答案 0 :(得分:1)
我删除了时钟,因为它没有使用最新的svg.js版本。 这是一个纠正的小提琴: https://jsfiddle.net/Vac2Q/6486/
这里有一些代码,所以我可以提交答案
see my code here ;)