javascript - Leaflet js添加自定义标记图片失败

Question

我正在尝试添加自定义标记图片，但它一直给我标准的蓝色标记。这是我的自定义标记定义：

var aMarker = {
                        lat:location.lat,
                        lng:location.lng,
                        message: location.name,
                        //                focus: true,
                        draggable: false,
                        getMessageScope: function() { return $scope; },
                        message: '<button class="icon-left ion-information-circled" ng-click=""></button>&nbsp;&nbsp;&nbsp;'+location.name,
                        compileMessage: true,
                        'icon': {
                          'type': "awesomeMarker", // i use awesomeMarker for font awesome
                          'icon': spotMarkerIcon, // a variable for my icon
                         }
                };

var spotMarkerIcon = L.icon({
    iconUrl: './images/SpotMarker.png'
});

angular.extend($scope,{
             defaults: {
                    tileLayer: 'http://server.arcgisonline.com/ArcGIS/rest/services/Ocean_Basemap/MapServer/tile/{z}/{y}/{x}',
                    maxZoom: 16,
                    zoomControlPosition: 'topright',
                    path: {
                        weight: 10,
                        color: '#800000',
                        opacity: 1
                    }
    }
});

angular.extend($scope,{
    markers : new Array() 
});

$scope.markers.push(aMarker);

Answer 1

您是否尝试过像这样定义图标的尺寸：

var greenIcon = L.icon({
    iconUrl: 'leaf-green.png',
    shadowUrl: 'leaf-shadow.png',

    iconSize:     [38, 95], // size of the icon
    shadowSize:   [50, 64], // size of the shadow
    iconAnchor:   [22, 94], // point of the icon which will correspond to marker's location
    shadowAnchor: [4, 62],  // the same for the shadow
    popupAnchor:  [-3, -76] // point from which the popup should open relative to the iconAnchor
});

编辑：这是一个工作示例：http: //jsfiddle.net/beLxbfep/