-
Notifications
You must be signed in to change notification settings - Fork 815
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat: update 'samples/overlay-hideshow' to account for tilt (v=beta) #929
Comments
This is probably the fix. I'll see about updating the sample to account for this. https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate3d() |
@jpoehnelt Awesome! Thank you for looking into this! |
No guarantees. It's been way too long since I took linear algebra and graphics courses! |
Some of the utils in deckgl might be useful?? https://github.com/visgl/deck.gl/blob/master/modules/google-maps/src/utils.js |
Thank you @jpoehnelt for the effort! I also found this old overlay-tiler repo that demonstrates how to transform an overlay (including planar rotation). var proj = this.getProjection(); // google.maps.Map.getProjection()
/* properties topLeft, topRight, bottomRight initialized in setInitialGCP_() line 110 */
var tl = proj.fromLatLngToDivPixel(this.get('topLeft'));
var tr = proj.fromLatLngToDivPixel(this.get('topRight'));
var br = proj.fromLatLngToDivPixel(this.get('bottomRight'));
img.style.transform = 'matrix(' + [tr.x - tl.x, tr.y - tl.y, br.x - tr.x, br.y - tr.y, tl.x, tl.y] + ')'; Regarding deckgl Not sure if this helps - I'll keep searching |
This can be served well by using Deck.gl with Bitmap Layer: |
Excellent @regeter ! Thank you so much! |
I noticed that the google.maps.OverlayView in 'overlay-hideshow' sample gets distorted when the map is tilted (beta feature).
See example (hold shift and drag with the mouse to tilt and rotate the map)
https://jsfiddle.net/jq5f0zsk/1/
The issue becomes apparent when the tilt > 0
Is there a way to configure the OverlayView to remain "flat"?
Alternatively, perhaps the 'div' can be transformed (3d rotation) to compensate for the tilt and rotation of the camera?
Thank you!
The text was updated successfully, but these errors were encountered: