Mustafa Agamey
Mustafa Agamey

Reputation: 513

framework7 cordova-plugin-googlemaps v2 z-index issue

I'm trying to use https://github.com/mapsplugin/cordova-plugin-googlemaps in framework7 project

but I'm facing a problem

as i navigate to the map page The image is loaded but wasn't displayed

I think the issue is z-index

I tried that solution

https://github.com/mapsplugin/cordova-plugin-googlemaps/issues/2028

but doesn't work

this is the page before map page

enter image description here

the red div is the place where image should display

enter image description here

after functions run i see that instead of map

enter image description here

I use this code to navigate to the map page

 success: function (response) {
                        var responseObj = JSON.parse(response)
                        console.log(responseObj);
                        this.$root.navigate("/theMapPage/")

                    }

Upvotes: 0

Views: 392

Answers (1)

Mustafa Agamey
Mustafa Agamey

Reputation: 513

I found the solution

as I posted in comment that the plugin make the map behind the application

so I hide all pages and show the current page only

 map.one(plugin.google.maps.event.MAP_READY, function () {
                        $$('.page').hide()
                        $$('.page.page-current').show()
                        map.clear();
                        map.getMyLocation(onSuccess, onError);
                    });

at end just show all pages again

        pageAfterOut: function () {
            // page has left the view
            $$('.page').show()
        }

Upvotes: 0

Related Questions