想要使用随缩放比例缩放的网格图像模式。一旦缩放,网格重新对齐到左上角并使网格不对齐。为了解决这个问题,我想将布料图像模式与负偏移对齐。目前,负偏移不会改变模式的偏移。也许有另一种方法可以解决这个问题,但不包括负偏移。
var canvas = new fabric.Canvas('canvas1', {
backgroundColor : "#FDF5E2"
})
canvas.setDimensions({
width: window.innerWidth,
height: window.innerHeight
});
const zoom = 1.4
fabric.Image.fromURL('https://i.imgur.com/e2BzQYC.png', (img) => {
img.scaleToWidth(25*zoom);
let patternSourceCanvas = new fabric.StaticCanvas();
patternSourceCanvas.add(img);
patternSourceCanvas.renderAll();
let pattern = new fabric.Pattern({
source: () => {
patternSourceCanvas.setDimensions({
width: img.getScaledWidth(),
height: img.getScaledHeight()
});
patternSourceCanvas.renderAll();
return patternSourceCanvas.getElement();
},
repeat: 'repeat',
offsetX: -12,
offsetY: -12
});
canvas.setBackgroundColor(pattern, () => { canvas.renderAll(); })
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.0.0-beta.7/fabric.js"></script>
<canvas id="canvas1"></canvas>
&#13;