Fabric.js changes my canvas size to 300x150 after initialization

Question

HTML:

  <div class="canvas-wrapper">     <canvas id="myCanvas"></canvas>   </div> 

CSS

.canvas-wrapper {     width: 900px;     min-height: 600px;  }   #myCanvas{      border:1px solid red;      position: absolute;      top:22px;      left:0px;      height: 100%;      width: 99%;  } 

JS

var myCanvas = new fabric.Canvas('myCanvas'); 

My canvas get resized to 300x150 after it's been initialized, why?

Answer 1

in the latest version, you will have to do something like:

var canvas = new fabric.Canvas('myCanvas'); canvas.setHeight(500); canvas.setWidth(800); 

.... Your code ....

canvas.renderAll(); 

Works fine for me..

For dynamically changing size, this works too