2015-12-03 147 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 
     } 
    });