2015-12-03 60 views
0

我正在使用Angular谷歌地圖,我想使用自定義標記。我不希望它是一個圖像。我想這樣的事情:角谷歌地圖自定義標記谷歌對象

icon: { 
      path: google.maps.SymbolPath.CIRCLE, 
      scale: 12, 
      fillColor: '#2677FF', 
      fillOpacity: 1, 
      strokeColor: '#ffffff', 
      strokeOpacity: 1, 
      strokeWeight: 6 
} 

但我得到一個錯誤,google is not defined。我如何獲得這個對象?

這是我的觀點:

<ui-gmap-google-map center='map.center' zoom='map.zoom' pan='true' refresh='true'> 

<ui-gmap-marker coords="map.currentPos.coords" options="map.currentPos.options" events="map.currentPos.events" idKey="map.currentPos.id" icon="map.currentPos.icon"> 
      </ui-gmap-marker> 

</ui-gmap-google-map> 

這裏是我的地圖:

$scope.map = { 
     center: { latitude: $scope.position.lat, longitude: $scope.position.lng }, 
     zoom: 10, 
     options: { scrollwheel: false, disableDefaultUI: true, draggable: true, scrollwheel: false }, 
     events: { 

     }, 
     markers: [], 
     bounds: {}, 
     polylines: [], 
     currentPos: { 
     id: 'currentpos', 
     coords: { 
      latitude: $scope.position.lat, 
      longitude: $scope.position.lng 
     }, 
     options: { draggable: false, clickable: false, zIndex: 1000 }, 
     events: { 

     }, 
     icon: '', 

     }, 
     control: { 
     refresh: function(){ 
     } 
     } 
    }; 

回答

0

google.maps.SymbolPath類樣品使用;

var marker = new google.maps.Marker({ 
    position: map.getCenter(), 
    icon: { 
     path: google.maps.SymbolPath.CIRCLE, 
     scale: 10 
    }, 
    draggable: true, 
    map: map 
    }); 
0

好吧,我發現如何做到這一點:

uiGmapGoogleMapApi.then(function(maps){ 
     $scope.map.currentPos.icon = { 
      path: google.maps.SymbolPath.CIRCLE, 
      scale: 12, 
      fillColor: '#2677FF', 
      fillOpacity: 1, 
      strokeColor: '#ffffff', 
      strokeOpacity: 1, 
      strokeWeight: 6 
     } 
    });