在HTML中显示.svg文件并使用鼠标在其上绘制线条的最佳方法

Question

请告诉我用HTML显示.svg文件并使用鼠标在其上绘制动态线的最佳方法

示例svg在这里SVG File

我用过 <object id='svgObj' type='image/svg+xml' data='https://dl.dropboxusercontent.com/u/18190667/4.svg'></object> 但无法得到我想要的东西

Answer 1

你可以这样表现出来：

<embed src="https://dl.dropboxusercontent.com/u/18190667/4.svg" type="image/svg+xml" />

http://jsfiddle.net/nAHze/

Answer 2

试试这个：

<canvas id="canvas" width="500" height="500">
</canvas>

样式：

canvas {
    border: 1px dashed rgb(200, 200, 200);
    background:url(https://dl.dropboxusercontent.com/u/18190667/4.svg);
}

请参阅此链接以在画布中绘制线条

Draw a line with two mouse clicks on HTML5 canvas?