在SVG编辑器加载时创建图像

Question

我正在做svg编辑器，特别是方法绘图的实现。

我想在加载编辑器时加载一个图像，而不是背景矩形。目前，javascript文件包含此命令，用于在编辑器中创建背景矩形。

var createBackground = function(fill) {
    svgCanvas.createLayer("background")
        cur_shape = svgCanvas.addSvgElementFromJson({
            "element": "rect",
            "attr": {

                "x": -1,
                "y": -1,
                "width": res.w+2,
                "height": res.h+2,
                "stroke": "none",
                "id": "canvas_background",
                "opacity": 1,
                "fill":  '#ffffff',
                "style": "pointer-events:none"

我想创建一个图像而不是一个矩形。

这个是可能的吗？

Answer 1

您可以像这样更改函数：

var createBackground = function(fill) {
    svgCanvas.createLayer("background")
        cur_shape = svgCanvas.addSvgElementFromJson({
            "element": "image",
            "attr": {
                "x": -1,
                "y": -1,
                "width": res.w+2,
                "height": res.h+2,
                "xlink:href": "/images/whatever.png" //this path should be changed
                "id": "canvas_background",
                "opacity": 1,
                "style": "pointer-events:none"