ionic framework - Google maps centered load failure -


well i'm having problem, load map once , works perfect. second time or once update map not load ok, not centered load when navigating on can see marks made deformed or lost.

i have tried several ways solve problem, first , common found use google.maps.event.trigger(map 'resize') did not work , logic, try whenever loading map executed, create new map, same data , focused neither worked me. may way use map. using plugin of camera in application, user takes photo , should detect draw picture , display map. each time view opened, plug of camera, in process of taking , show picture call appropriate functions load map , has me bit tricky loaded have time locked in problem, found solutions serve me browser, device not work. using ionic framework , plugins cordova.

img

controller :

.controller("camaractrl", function($scope,$rootscope, camera,$cordovageolocation,$state,$location,$ionicsidemenudelegate) {    var posoptions = {timeout: 10000, enablehighaccuracy: false}; $cordovageolocation   .getcurrentposition(posoptions)   .then(function (position) {     var latitud_actual  = position.coords.latitude     var longitud_actual = position.coords.longitude     $scope.latitud = latitud_actual;     $scope.longitud = longitud_actual;           //$scope.map = new google.maps.map(document.getelementbyid("mapa_ubicacion"), mapoptions);   }, function(err) {     // error   });    function initialize() { var mapoptions = {   center: new google.maps.latlng($scope.latitud, $scope.longitud),               zoom: 15,               maptypeid: google.maps.maptypeid.roadmap,               scrollwheel: false }; var map = new google.maps.map(document.getelementbyid("map"),     mapoptions); $scope.setmarker(map, new google.maps.latlng($scope.latitud, $scope.longitud), 'yo', ''); $scope.map = map; } $scope.setmarker = function(map, position, title, content) {   var marker;   var markeroptions = {       position: position,       map: map,       title: title   };    marker = new google.maps.marker(markeroptions);    google.maps.event.addlistener(marker, 'click', function () {       // close window if not undefined       if (infowindow !== void 0) {           infowindow.close();       }       // create new window       var infowindowoptions = {           content: content       };       infowindow = new google.maps.infowindow(infowindowoptions);       infowindow.open(map, marker);   });  }  $scope.mostrar_form = false;  $scope.mostrar_boton_view = false;  $scope.getphoto = function() { camera.getpicture().then(function(imageuri) {   console.log(imageuri);   $scope.lastphoto = imageuri;   $scope.mostrar_form = true;   $scope.mostrar_boton_view = false;   google.maps.event.adddomlistener(window, 'load', initialize);     initialize(); }, function() {   $scope.mostrar_boton_view = true; }, {   quality: 75,   targetwidth: 320,   targetheight: 320,   savetophotoalbum: false   });  };   $scope.getphoto(); }) 

the solution found create function executes map again. should not optimal @ least solved problem.

$scope.centrar =  function(){   var mapoptions = {     center: new google.maps.latlng($scope.latitud, $scope.longitud),               zoom: 15,               maptypeid: google.maps.maptypeid.roadmap,               scrollwheel: false    };    var map = new google.maps.map(document.getelementbyid("map"),     mapoptions);    $scope.setmarker(map, new google.maps.latlng($scope.latitud, $scope.longitud), 'yo', '');    $scope.map = map; } 

Comments

Popular posts from this blog

c++ - No viable overloaded operator for references a map -

java - Custom OutputStreamAppender not run: LOGBACK: No context given for <MYAPPENDER> -

java - Cannot secure connection using TLS -