This question has been asked before but I could not find an answer for my case. I have a Cordova jQuery mobile app. One of the app pages has a google map which I have to initialize every time I load the page. I am doing something like this
var canvas = $('#journey_map_canvas')[0];
tripOptions.journeyMap = new google.maps.Map(canvas, tripOptions.journeyMapOptions);
After this I plot a route using polyline. On the page container hide event I remove the route but keep the previous map.
function unplotRoute() {
for (var i = 0; i < tripDetailsObject.segmentLine.length; i++) {
tripDetailsObject.segmentLine[i].setMap(null);
}
tripDetailsObject.segmentLine = [];
}
Instead of initializing this map when the page is loaded I want to reuse it but I don't know how to do that. I have the map saved in tripOptions.journeyMap
object and I have checked that it this object still exists on page unload. But if I do not reinitialize this object and attach it to the the canvas it doesn't get attached to the canvas element of the DOM.