My app works fine on browser but doesn't render the google map on emulator. This app is based on an exisiting app that already has a google map working fine on emulator (and device) I think because navigator.geolocation.getCurrentPosition it's not triggering. I edited AndroidManifest.xml with but I still with this problem. This is my controller:
.controller('MapsCtrl', function($scope, Service, $ionicLoading, $ionicPopup, $compile) {
$ionicLoading.show();
Service.getSedi().then(function(result){
var sede = result.data[0];
navigator.geolocation.getCurrentPosition(function(pos){
var myPosition = new google.maps.LatLng(pos.coords.latitude,pos.coords.longitude);
var map = new GMaps({
div: '#maps',
lat: pos.coords.latitude,
lng: pos.coords.longitude
});
map.addMarker({
lat: sede.indirizzo.lat,
lng: sede.indirizzo.lng,
title: sede.titolo,
infoWindow: {
content: '<h3>' + sede.titolo+ '</h3><p style="color:black">' + sede.indirizzo.address +'</p>'
}
});
//reverse geocoding (from coordinates get human readable address)
var geocoder = new google.maps.Geocoder();
var opt = {
lat : pos.coords.latitude,
lng : pos.coords.longitude,
callback : function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
console.log(results[1].formatted_address + ' ' + myPosition);
map.addMarker({
position: myPosition,
infoWindow:{
content: '<h3>Estas aquí</h3><p style="color:black">' + results[1].formatted_address + '</p>'
}
});
}
}
};
GMaps.geocode(opt);
//end reverse geocoding
map.drawRoute({
origin: [pos.coords.latitude,pos.coords.longitude],
destination:[sede.indirizzo.lat,sede.indirizzo.lng],
travelMode: 'driving',
strokeColor: '#131540',
strokeOpacity: 0.6,
strokeWeight: 6
});
//search places
var arrayId = [];
map.addLayer('places', {
location : new google.maps.LatLng(pos.coords.latitude,pos.coords.longitude),
radius : 600,
types : ['cafe', 'bar', 'food'],
search: function (results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
var place = results[i];
//here I can use place.place_id
arrayId.push(place.place_id);
map.addMarker({
lat: place.geometry.location.lat(),
lng: place.geometry.location.lng(),
title : place.name,
infoWindow : {
content : '<h3>'+place.name+'</h3><p style="color:black">'+(place.vicinity ? place.vicinity : place.formatted_address)+'</p><img src="'+place.icon+'"" height="20px"/>'
}
});
}
}
}
});
//map.zoomOut(5);
//Creo el div y los botones
var node = document.createElement("div");
var text = document.createTextNode("ACA VAN LOS BOTONES");
node.appendChild(text);
node.setAttribute("id", "mapBottom");
document.getElementById("maps").appendChild(node);
},function(error){
$ionicPopup.alert({
title: 'Error',
template: 'code: ' + error.code + '\n' + 'message: ' + error.message + '\n'
});
});
$ionicLoading.hide();
},function(){
$ionicLoading.hide();
$ionicPopup.alert({
title : "Error",
template : "Server Error!<br>Restart Application!"
});
});
})Any ideas? Thanks in advance!
