使用Raphael.js绘制图像

Question

我可以将Raphael.js画布放在IMG元素上吗？我该怎么做才能使这个布局有效？

Answer 1

只需使用常规CSS技术将Raphaël画布放在图像元素的顶部:

#wrapper {
    position: relative;
    padding: 0;
    outline: 1px solid #999;
}
#wrapper img {
    position: absolute;
    top: 0;
    left: 0;
}
#canvas {
    position: absolute;
    top: 0;
    left: 0;
}

然后嵌套你的元素,如下所示:

<div id="wrapper">
    <img src="myimage.jpg">
    <div id="canvas">  
    </div>
</div>

这是一个完整的例子.