Fabric Js - Возможно ли автоматическое масштабирование объекта изображения на холсте?

Question

Мы в настоящее время загрузки изображения с помощью кода ниже:

 reader.onload = function (event) { 
      fabric.Image.fromURL(event.target.result, function (img) { 
       whiteboardService.uploadImageToCanvas(img); 
      }); 
     } 

и ...

service.uploadImageToCanvas = function (image) { 
     service.canvas.add(image); 

     image.id = service.getUniqueId(); 
     service.objectMap[image.id] = image; 

     var data = { 
      image: image, 
      id: image.id 
     }; 

     signalService.sendMessage(service.recipient, data); 
    }; 

Если изображение слишком велико, больше нашей фиксированной ширины и высоты холста было бы возможно ли, чтобы это изображение было автоматически уменьшено, чтобы вписаться в фиксированную ширину и высоту холста?

Я должен отметить, что я использую Angular.js а

та

Answer 1

fabricjs положить очень простой способ сделать это. Эти методы scaleToWidth и scaleToHeight, которые близки к «применить масштабный коэффициент, который будет соответствовать изображение по указанным размерам»

Таким образом, вы можете сделать

image.scaleToWidth(service.canvas.getWidth()); 
service.canvas.add(image); 

это зависит, если вы хотите сохранить пропорции если вам нужно масштабировать для самого большого, самого маленького или обоих.