How to set background image for a rectangle in Joi

Question

How to set background image attribute for a rectangle in my JointJs application ?

Answer 1

Rectangle object doesn't have that attribute perse....what you can do it's create an image object itself:

var image = new joint.shapes.basic.Image({
    position : {
        x : 50,
        y : 40
    },
    size : {
        width : 16,
        height : 16
    },
    attrs : {
        image : {
            "xlink:href" : "images/background.png",
            width : 16,
            height : 16
        }
    }
});

graph.addCell(image);

Then you can play as you need with the attrs of it, you can even create ports and set arrows later if you wish to do diagrams. Other way it's to create a rectangle object and then create this image object above as a cover (in case you need specific attrs from rectangle to code).Tell me how it goes.