0

Je veux savoir si c'est possible de changer l'icône par défaut (bleu), avec une autre icône personnalisée lorsque l'application est initialisée, je lis sur la façon de changer mais je veux une icône personnalisée pour l'application entière.Comment changer l'icône par défaut de la directive de la notice?

HTML

<div ng-controller="CustomizedMarkersController"> 
    <button type="button" class="btn btn-primary padright" ng-click="markers.m1.icon=icon" ng-repeat="(key, icon) in icons">{{ key }}</button> 
    <leaflet markers="markers" center="lisbon"></leaflet> 
</div> 

JS

app.controller("CustomizedMarkersController", [ '$scope', function($scope) { 
    var local_icons = { 
     default_icon: {}, 
     leaf_icon: { 
      iconUrl: 'examples/img/leaf-green.png', 
      shadowUrl: 'examples/img/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 
     }, 
     div_icon: { 
      type: 'div', 
      iconSize: [230, 0], 
      html: 'Using <strong>Bold text as an icon</strong>: Lisbon', 
      popupAnchor: [0, 0] 
     }, 
     orange_leaf_icon: { 
      iconUrl: 'examples/img/leaf-orange.png', 
      shadowUrl: 'examples/img/leaf-shadow.png', 
      iconSize:  [38, 95], 
      shadowSize: [50, 64], 
      iconAnchor: [22, 94], 
      shadowAnchor: [4, 62] 
     } 
}; 

angular.extend($scope, { 
    icons: local_icons 
}); 

angular.extend($scope, { 
    lisbon: { 
     lat: 38.716, 
     lng: -9.13, 
     zoom: 8 
    }, 
    markers: { 
     m1: { 
      lat: 38.716, 
      lng: -9.13, 
      message: "I'm a static marker", 
      icon: local_icons.default_icon, 
     }, 
    }, 
    defaults: { 
     scrollWheelZoom: false 
    } 
}); 
}]); 

Based on this example.

Répondre

0

De l'Leaflet documentation, see Icon.Default:

Pour changer l'icône par défaut, il suffit de modifier les propriétés de L.Icon.Default.prototype.options (qui est un ensemble de Icon options).

par exemple, inclure une ligne dans votre code est:

L.Icon.Default.prototype.options.iconUrl = 'myNewDefaultImage.png'; 

Vous voudrez probablement aussi changer l'ombre et l'icône de 2x pour les écrans de la rétine, qui sont définies avec des options shadowUrl et iconRetinaUrl.