I'm unable to get regular pinch zoom to work with a ZIM Frame/Stage on mobile. It seems like the entire ZIM/Canvas element isn't responding to these types of gestures. This is an issue on Safari, Chrome, and Samsung Internet on both Android and iOS. For example: If I have a website with a ZIM Frame at the top and other HTML elements below, pinch zoom only works on the other HTML elements. If I pinch zoom on the elements that do respond, the entire page zooms like expected, including the ZIM Frame. I've looked into gesture(), but as far as I can see, this only works on DisplayObjects, not on the entire Frame/Scene. Does anyone have any tips on how to enable pinch zoom on the ZIM Frame?
We either get interaction on the canvas or on html. This is a general limitation on the canvas, not a ZIM thing. You can put the canvas under the html with z-index until it is pinched to the right size, then have a button "PLAY" in HTML on top. Once the button is pressed, remove it and set the z-index of the canvas to higher. But... once they do, they can no longer pinch zoom, etc, unless there was a reverse button provided on the canvas.
You can manually calculate pinch and zoom on the canvas but both fingers would have to be on the canvas. With the pinch and zoom calculated, there is probably a way to make the full page zoom in and out - I am not sure, would a css transform work on the body? I have not tried. And again, awkward as both fingers would need to be on the canvas - or both fingers on the HTML.
So, usually, we design around it. Maybe, have a preview image in the HTML link to a full screen canvas version for instance. It depends on what you are doing.