Reputation: 302
Hello i am working on onsen ui with angularjs and have made a demo app which includes google maps,All things were working smootly,But after testing i found an issue on ons-back-button,Please see the case,I have page1 which containc google maps and when page loaded first time map is completely loaded fine,but from page1 when i navigate to page2 and returns back to page1 using (ons-back-button) ,my map broken and never loaded..I have wasted my 3 days in solving this,with no luck,can anyone please help me how to solve it,my code is: html
<div class="mapclass">
<ons-row class="app-map">
<ons-col>
<map zoom="11" center="[{{lat}}, {{lng}}]"
draggable: false >
<info-window id="marker-info" >
<div class="mpopup-wrap" style="padding: 0; width: 250px;">
<div class="mpopup-box">
<strong class="title">{{ infoWindow.title}}</strong>
<img src="{{mapimg}}" style="float: left; width: 80px; height: 53px; margin-right: 5px;" />
<span class="info">
<i class="fa fa-map-marker"></i>
{{infoWindow.loc}}
</span>
<span class="info">
<i class="fa fa-home"></i>
{{infoWindow.content}}
</span>
</div>
</div>
</info-window>
<marker ng-repeat="(id, marker) in markers" id="{{ id}}"
position="[{{lat}}, {{lng}}]"
title= "hello"
visible="true"
on-click="showMarker(event, $index)" >
</marker>
</map>
</ons-col>
</ons-row>
</div>
Upvotes: 0
Views: 497
Reputation: 1339
Try using prepop or postpop to execute or reload the goole maps.
Upvotes: 1
Reputation: 861
I think this thread might be very connected to your issue. I'm not familiar with onsen, but what you would like to do anyways is to control the behavior from some controller, and with UI-route-provider, you could manage to control if page reloads on switch.
See the first answer here
Upvotes: 0