2016-11-18 10 views
0

私は、データベースから取得したlatlngに基づいてマーカーを追加する必要があるプロジェクトに取り組んでいます。地図は正常に読み込まれますが、どういうわけか私はマップ上にマーカーを表示できません。ここでAngularjs Google Map Add Markers

JAVASCRIPT

var app = angular.module('myApp', ['ngResource']); 

app.service('Map', function($q) { 
    this.init = function() { 
     navigator.geolocation.getCurrentPosition(function(position) { 
     var MapOptions = { 
      center: new google.maps.LatLng(38.431934, 141.309402), 
      zoom: 16, 
      disableDefaultUI: true, 
      draggable: true, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
     }; 
     this.map = new google.maps.Map(document.getElementById("map"), MapOptions); 
     this.places = new google.maps.places.PlacesService(this.map); 
     }); 
    } 
}); 

app.controller('MainCtrl', function($scope, $resource, Map) { 
    $scope.fetchdata = {}; 
    var Fetchdata = $resource('http://localhost:8080/fetchnote'); 
    Fetchdata.query(function(results) { 
    $scope.fetchdata = results; 
    angular.forEach($scope.fetchdata, function(value, index) { 
     var lat = value.latitude; 
     var lng = value.longitude; 
     addtomap(lat, lng) 
    }) 
    }) 

    function addtomap(lat, lng, icon) { 
    var marker = new google.maps.Marker({ 
     position: new google.maps.LatLng(lat, lng), 
     map: Map.map 
    }); 
    } 
    Map.init(); 
}); 

私は追加したりするのを忘れて何があります私のコードです??

+0

があなたのMap.init後 –

+0

はそれを試すが、それでも同じaddtomap(LAT、LNG)関数を呼び出してみてくださいすることができ、あなたの問題を解決します –

答えて

0

は地図が初期化される前にあなたがあなたのマーカーを呼んでいた、サーバー値で値を交換し、それが機能しなければならない。このhttp://jsfiddle.net/pc7Uu/3153/

Map.init(); 
angular.forEach($scope.fetchdata, function(value, index) { 
    //alert(value); 
    var lat = value.latitude; 
    var lng = value.longitude; 
    addtomap(lat, lng) 
}); 

を参照してください。

希望これは