Google Maps script loading issue in custom plugin meta box

  • Cas Dekkers

    (@casdekkers)


    10 years, 4 months ago

    Hi all,

    I am creating a custom post type plugin for my blog and I’m using the Google Maps Javascript API (v3) to let plugin users specify some location info. To achieve this, I have implemented this example into the HTML section of a meta box. However, I noticed some unwanted behaviour when loading the script while the meta box content is hidden from view.

    Please refer to this image. Notice the small triangle in the top right. When you click it, the meta box content (in this case, the “Secure post” and “Secure child post”) gets hidden from view.

    Now, when I load my plugin page while the meta box content containing the Maps script is not hidden, everything works like a charm. When I load my plugin page while the meta box content containing the Maps script is hidden, and I proceed to click the small triangle to reveal the map, the entire map is completely greyed out. The autocomplete function (explained in the code sample mentioned above) still works, and the script still puts markers on the ‘map’ (which is now a grey area).

    Does anyone know what causes this? I think the script does not get invoked/executed if it is hidden from view. I tried removing the async defer attributes for the <script> tag, but that didn’t solve anything.

    Thanks for replying!

Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    10 years, 4 months ago

    I think the script is loaded, hidden or not. I think the problem is the map tile display is not managed by the browser, it is done by the map script, which thinks it already did its job.

    You probably need to add a listener function to the toggle display triangle that explicitly causes the map to redraw the tiles when the display triangle is clicked. For example, asking the map to zoom should cause a redraw. You may get a redraw just zooming to the current zoom level.

    All complete speculation on my part, but I’m quite certain that a redraw script of some sort needs to execute when the toggle triangle is clicked.

Viewing 1 replies (of 1 total)

The topic ‘Google Maps script loading issue in custom plugin meta box’ is closed to new replies.