set width and height of canvas in fabric.js

I have an image background in my HTML5 canvas.

var canvas = new fabric.Canvas('#canvas1');
canvas.setBackgroundImage(
            'http://fabricjs.com/assets/jail_cell_bars.png',
             canvas.renderAll.bind(canvas)
       );

How to set dimensions of my canvas (width, height) to the dimensions of the background image?

Thanks.

You can use CSS or dom properties to set the dimensions of your canvas. If you know the dimensions of your image, you can do it in a stylesheet:

#canvas1 { width: XXXpx; height: YYYpx; }

Or in the dom:

<canvas id="canvas1" width="XXX" height="YYY"></canvas>

If the image is dynamic and want to set the dimensions in JS, you do something like this:

var image = new Image()
image.src = 'http://fabricjs.com/assets/jail_cell_bars.png';

image.onLoad = function () { 
  var canvas = document.getElementById('canvas1');

  canvas.width = image.width;
  canvas.height = image.height;
};