diegoazh / gmap-vue

A wrapper component for consuming Google Maps API built on top of Vue. Fork of the popular vue-google-maps plugin.
https://diegoazh.github.io/gmap-vue/
173 stars 51 forks source link

Bug: Page jumps on map click and pan #311

Closed thechrislundy closed 10 months ago

thechrislundy commented 10 months ago

Please complete all sections that you can but please don't remove any section, otherwise the bot will close your issue because it doesn't meet our issue template (you can remove this comment)

Describe the bug

Clicking on map or panning map causes page to jump if part of the map extends out of the viewport.

To reproduce

Steps to reproduce the behavior:

  1. Go to https://nwac.us.
  2. Make sure either the top or bottom of the map extends outside the viewport.
  3. Click on map or pan map.
  4. Page will jump either up or down.

Expected behavior

Page should not move when clicking or panning map.

Current behavior

Clicking on map or panning map causes page to jump if part of the map extends out of the viewport.

Screenshots

If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information)

Smartphone (please complete the following information)

Additional context

I have reduced the code to a very simple example (not in above URL), removing all map features and simplifying the styling. The problem persists.

Versions

Package manager

Plugin version

thechrislundy commented 10 months ago

Here is a simplified code sandbox reproducing the issue: https://hxjtyh.csb.app

To reproduce bug:

  1. make sure that either the top or bottom of the map extends off the screen.
  2. click or pan the map.
  3. the map will jump up or down.
thechrislundy commented 10 months ago

This is actually a google map issue. I added v: "quarterly" in the init options to use an older version. That solved it.