Search code examples
javascriptcanvasfabricjs

How to change width\height of fabric.Path object? Params width\height in constructor don't work

I use fabric-js and try to pass width and height of fabric.Path via params in constructor like so:

const path = 'M16.2777 24.96C15.4876 26.3467 13.5124 26.3467 12.7223 24.96L0.27808 3.12C-0.512027 1.73333 0.475607 0 2.05582 0H26.9442C28.5244 0 29.512 1.73333 28.7219 3.12L16.2777 24.96Z';

const mapObject = new fabric.Path(path , {
  width: 30, //
  height: 30, //
  left: 100,
  top: 100,
  fill: '#c9c9c9',      
});

It works fine, but I can't affect to "image size". I pass different values but nothing changes.

Where am I wrong and how can I set size of fabric.Path object?

Solution

  • Path objects can be resized by changing the scaleX and scaleY values.

    To achieve a specific width or height, you can also use the scaleToWidth() and scaleToHeight() methods.

    http://fabricjs.com/docs/fabric.Path.html#scaleToHeight http://fabricjs.com/docs/fabric.Path.html#scaleToWidth