V2: How to handle large images

[krzcho]

I have images larger than the screen so they are scaled using height attribute
Then IMG is used as a Cropper() argument and below template

<cropper-canvas background style="top:50px;left:50px;width:calc(100% - 100px);height:calc(100% - 100px);"> <cropper-image initial-center-size="contain" rotatable scalable skewable translatable></cropper-image> <cropper-shade hidden></cropper-shade> <cropper-handle action="select" plain hidden></cropper-handle> <cropper-selection initial-coverage="1.0" dynamic movable resizable> <cropper-grid role="grid" bordered covered></cropper-grid> <cropper-crosshair centered></cropper-crosshair> <cropper-handle action="move" theme-color="rgba(255, 255, 255, 0.35)"></cropper-handle> <cropper-handle action="n-resize"></cropper-handle> <cropper-handle action="e-resize"></cropper-handle> <cropper-handle action="s-resize"></cropper-handle> <cropper-handle action="w-resize"></cropper-handle> <cropper-handle action="ne-resize"></cropper-handle> <cropper-handle action="nw-resize"></cropper-handle> <cropper-handle action="se-resize"></cropper-handle> <cropper-handle action="sw-resize"></cropper-handle> </cropper-selection> </cropper-canvas>

Do I need to code for initial-center-size="contain" or is it build it? I am not able to see the image scaled to the canvas; canvas has the correct size but the image within has original dimesions despite height attribute

Why do my image moves with the selection while dragging?

[krzcho]

Ok I am calculating and applying proper scale to the image but then my selection is incorrect and when moving it moves with the image :(

[krzcho]

It does not move with the image when it is not dynamic (bug?)