Image over canvas in background

[Fanfong68]

Is it possible to use background canva and image together. I am going to generate a certificate, so i need a frame and a few rectangles as the background. Below is my code:

     background: function(currentPage, pageSize) {
        return {
            canvas: [
                {
                    type: 'rect',
                    x: pageSize.width * 0.42,
                    y: pageSize.height * 0.16,
                    w: pageSize.width * 0.08,
                    h: pageSize.height * 0.04,
                    lineColor: 'black',
                },
                {
                    type: 'rect',
                    x: pageSize.width * 0.84,
                    y: pageSize.height * 0.16,
                    w: pageSize.width * 0.08,
                    h: pageSize.height * 0.04,
                    lineColor: 'black',
                },
                {
                    type: 'rect',
                    x: pageSize.width * 0.64,
                    y: pageSize.height * 0.32,
                    w: pageSize.width * 0.28,
                    h: pageSize.height * 0.12,
                    lineColor: 'black',
                },
                {
                    image: 'sampleImage.jpg',
                    width: pageSize.width,
                    height: pageSize.height,
                    absolutePosition: { x: pageSize.width * 0.37, y: pageSize.height * 0.001 },
                    // opacity: 0.3,
                    // margin: [0, -120, 0, 0]
                }
            ]
            
        };
    },

[liborm85]

You can use stack, example:

var dd = {
	content: [
		'First paragraph',
		'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
	],
	     background: function(currentPage, pageSize) {
        return {
            stack: [
                {
                    image: 'sampleImage.jpg',
                    width: pageSize.width,
                    height: pageSize.height,
                    absolutePosition: { x: pageSize.width * 0.37, y: pageSize.height * 0.001 },
                    // opacity: 0.3,
                    // margin: [0, -120, 0, 0]
                },
                {
            canvas: [
                {
                    type: 'rect',
                    x: pageSize.width * 0.42,
                    y: pageSize.height * 0.16,
                    w: pageSize.width * 0.08,
                    h: pageSize.height * 0.04,
                    lineColor: 'black',
                },
                {
                    type: 'rect',
                    x: pageSize.width * 0.84,
                    y: pageSize.height * 0.16,
                    w: pageSize.width * 0.08,
                    h: pageSize.height * 0.04,
                    lineColor: 'black',
                },
                {
                    type: 'rect',
                    x: pageSize.width * 0.64,
                    y: pageSize.height * 0.32,
                    w: pageSize.width * 0.28,
                    h: pageSize.height * 0.12,
                    lineColor: 'black',
                },
            ]
        }]
            
        };
    },
	
}