xkjyeah / vue-google-maps

Google maps component for vue with 2-way data binding
https://xkjyeah.github.io/vue-google-maps/
1.88k stars 475 forks source link

How can I load a map after centain event? #222

Closed jonatasgrosman closed 7 years ago

jonatasgrosman commented 7 years ago

I'm trying to put a map inside a material dialog (http://vuematerial.io/#/components/dialog), but I'm having some troubles 'cause the creation of dialog element occurs after a "open" event, in other words, when my page loads, the container element that gmaps needs is not there, then the map doesn't load properly. How can I fix it? I think I need some way to load a map only after open the dialog.

xkjyeah commented 7 years ago

Just use GmapMap. It always creates the map after the component is available. After the dialog is open, use the resize bus to trigger a resize. http://xkjyeah.github.io/vue-google-maps/resize-bus.html

On 29 Sep 2017 6:11 am, "Jonatas Grosman" notifications@github.com wrote:

I'm trying to put a map inside a material dialog (http://vuematerial.io/#/ components/dialog), but I'm having some troubles 'cause the creation of dialog element is make after a "open event", in other words, when my page loads, the container element that gmaps needs is not there, then the map doesn't load properly. How can I fix it? I think I need some way to load a map only after dialog "open event".

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/xkjyeah/vue-google-maps/issues/222, or mute the thread https://github.com/notifications/unsubscribe-auth/ACiTR0WKQC7vYRMQk2k4rjsoRKY-l7z-ks5snBl2gaJpZM4Pn9Lp .

jonatasgrosman commented 7 years ago

Thanks @xkjyeah,

I don't know why, but my problem was not about resizing, but about component rendering. I've solved that issue using a "v-if" to prevent map loading before the dialog opening.