Рисование изображения внутри фигуры с помощью Fabricjs

В настоящее время я работаю над обработкой изображений в Canvas и Javascript. Я использую для этого fabric.js. Я просто хочу, чтобы пользователь загрузил изображение и слил его с предоставленным нами шаблоном. например,

the Template

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

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

Как я могу решить эту проблему, предоставив моему пользователю простой в использовании интерфейс? Я пробовал использовать функцию ClipTo в fabric.js, но она не работает с объектом изображения.

7
задан Cody Gray 13 August 2017 в 07:52
поделиться