用ngmap在html中的客戶標記Angularjs

Question

我正在做一個項目，在這裏我使用ngmap 1.13.13和angularjs在地圖上顯示了大量的船隻。我想在我的地圖上有自定義標記。但我從未在地圖上獲得它們，或者如果它們沒有縮放。我嘗試不同的方法，這裏有兩個：

<div ng-repeat="p in points"> 
<marker icon="http://www.cliparthut.com/clip-arts/823/arrowhead-clip-art-823528.png" icon.scale="0.1" position="{{p.latitude}}, {{p.longitude}}"></marker> 
</div> 

也做了這一個：（這裏的圖像顯示，但規模沒有工作）

<div ng-repeat="p in points"> 
<marker icon="{url: '../../images/delta.png', scale: 10}" position="{{p.latitude}}, {{p.longitude}}"></marker> 
</div> 

但是毫無效果，和圖標顯示太大或根本沒有顯示。特別是我只想使用自定義比例的自定義圖像。我看到很多其他的帖子，他們在控制器中定義了標記，但是我不知道如何「告訴」我的觀點，即它應該使用控制器中的預定義標記。

Answer 1

要縮放標記圖標，您可以指定scaledSize屬性。

例

var app = angular.module('mapApp', ['ngMap']); 
 
app.controller('mapCntrl', function ($scope) { 
 

 
    $scope.points = [ 
 
     { "name": "Canberra", "latitude": -35.282614, "longitude": 149.127775 }, 
 
     { "name": "Melbourne", "latitude": -37.815482, "longitude": 144.983460 }, 
 
     { "name": "Sydney", "latitude": -33.869614, "longitude": 151.187451 } 
 
    ]; 
 

 

 
    $scope.customIcon = { 
 
     "scaledSize": [32, 32], 
 
     "url": "http://www.cliparthut.com/clip-arts/823/arrowhead-clip-art-823528.png" 
 
    }; 
 

 
});

<script src="https://maps.google.com/maps/api/js"></script> 
 
<script src="https://code.angularjs.org/1.3.15/angular.js"></script> 
 
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
 
<div ng-app="mapApp" ng-controller="mapCntrl"> 
 
    <ng-map center="[-26.6875847,135.0857733]" style="height: 480px;" zoom="4"> 
 
     <div ng-repeat="p in points"> 
 
      <marker icon="{{customIcon}}" position="{{p.latitude}}, {{p.longitude}}" ></marker> 
 
     </div> 
 
    </ng-map> 
 
</div>