Google map async passing dynamic latitude and longitude doesn't work


#1

i’m trying to pass parameters dinamically to google map…
in index.html

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyC--xZJsCJCt7ZHQ-Ij2x1im9LS6a4Vk-Y&sensor=true"></script>

in controllers.js

    .controller('MapController', function($scope, $ionicLoading, $compile) {
// {{item.metadata.xreference}}
//


 $scope.vaiconlamappa = function(lat,lon) {
//alert(lat);
//var lat=43.07493;
//var lon=-89.381388;

var myLatlng = new google.maps.LatLng(lat,lon);
    
    var mapOptions = {
      center: myLatlng,
      zoom: 16,



 mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map"),
    mapOptions);

var marker = new google.maps.Marker({
  position: myLatlng,
  map: map,
  title: 'Luogo Indicato'
});

google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
});

$scope.map = map;
  }

  
  
})

in content.html

   <style>
#map{
width:100%;
height:250px;
}
.scroll {
  height: 100%;
}
</style>
<div class="item item-avatar">
  <h2>{{item.title}}</h2>
  <p>{{item.published_date}}</p>
</div>

<div class="item item-body">
  <img class="full-image" ng-src="{{item.images.image_fulltext}}">
  <div ng-bind-html="item.content"></div>
</div>


<div id="map" ng-controller="MapController" data-tap-disabled="true" on-create="vaiconlamappa({{coordinates.latitude}},{{coordinates.longitude}})"></div><br><br>
  </ion-content>
</ion-view>

But in div map nothing appear…
the latitude and longitude must be loaded dynamically…

see example in http://demoweb.actainfo.it/actapp20/www/
when you click on article (it contain coordinates) and you should see the map

any help will be apprecied :slight_smile: tnx