Я использую fabric.js 1.7.13. Пока применяется отсечение изображения внутри прямоугольника, оно работает нормально. Но не работает должным образом для мобильных устройств. Даже если задано правильное положение объекта изображения для отсечения, оно не отображается должным образом.
Вот пример кода:
img.clipTo = function (ctx) {
ctx.save();
ctx.setTransform(1, 0, 0, 1, 0, 0);
ctx.rect(boxLeft, boxTop, boxWidth, boxHeight);
});
Этот код отлично работает на рабочем столе. Но не работает должным образом для мобильных устройств.
Кроме того, я установил RetinaScaling, как показано ниже. Это работает для отсечения, но не работает для выбора объекта.
var retina = canvas.getRetinaScaling();
ctx.setTransform(retina, 0, 0, retina, 0, 0);
Для выбора объекта, сделал ниже код, все еще не работает должным образом.
img.setCoords();
canvas.renderAll();
Также после созданного холста, в html, показывается разная ширина и высота для верхнего и нижнего холста только для мобильных устройств. С нашей стороны, просто установите ширину и высоту холста, как показано ниже:
canvas.setWidth(420);
canvas.setHeight(420);
Но почему ширину и высоту 720 использовали для нижнего холста для мобильного просмотра.
Вот ссылка на изображение мобильного вида:
