gpt4 book ai didi

javascript - 如何更改传单指令上的默认图标图钉?

转载 作者:行者123 更新时间:2023-11-29 17:54:39 25 4
gpt4 key购买 nike

我想知道是否可以更改默认图标(蓝色),在应用程序初始化时使用另一个自定义图标,我阅读了有关如何更改的信息,但我想要整个应用程序的自定义图标。

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.

最佳答案

来自Leaflet documentation, see Icon.Default :

In order to change the default icon, just change the properties of L.Icon.Default.prototype.options (which is a set of Icon options).

例如,在您的代码中包含一行:

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

您可能还想更改视网膜显示器的阴影和 2x 图标,这些是使用选项 shadowUrliconRetinaUrl 设置的。

关于javascript - 如何更改传单指令上的默认图标图钉?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40414032/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com