I am working on a image loading system and for it to work on mobile, I need to get coordinates of the center of canvas for my current view. It should return the same result as if I mouse over the center.
I tried asking on fabric js github and they gave me this: but that result gave me back half my canvas height and width every time. can anyone help me understand why?
var myCenterCoordinates = fabric.util.transformPoint({
x: canvas.width / 2,
y: canvas.height / 2,
}, fabric.util.invertTransform(canvas.viewportTransform));
If i mouse over the exact center of the canvas(i do have mouse position set up), I should see the same result of(x and y) if i call getcentercoordinates function
edit: fabric.util.invertTransform(canvas.viewportTransform)[4] and fabric.util.invertTransform(canvas.viewportTransform)[5] gives you your current x and y coodinates for top left corner of your current view point, so we might be able to do something with that strong text
I found the answer:
var zoom=canvas.getZoom()
function CenterCoord(){
return{
x:fabric.util.invertTransform(canvas.viewportTransform)[4]+(canvas.width/zoom)/2,
y:fabric.util.invertTransform(canvas.viewportTransform)[5]+(canvas.height/zoom)/2
}
}
to use this:
var centerX=CenterCoord().x
var centerY=CenterCoord().y