102 lines
2.4 KiB
JavaScript
102 lines
2.4 KiB
JavaScript
/*
|
|
* L.Icon is an image-based icon class that you can use with L.Marker for custom markers.
|
|
*/
|
|
|
|
L.Icon = L.Class.extend({
|
|
options: {
|
|
/*
|
|
iconUrl: (String) (required)
|
|
iconRetinaUrl: (String) (optional, used for retina devices if detected)
|
|
iconSize: (Point) (can be set through CSS)
|
|
iconAnchor: (Point) (centered by default, can be set in CSS with negative margins)
|
|
popupAnchor: (Point) (if not specified, popup opens in the anchor point)
|
|
shadowUrl: (Point) (no shadow by default)
|
|
shadowRetinaUrl: (String) (optional, used for retina devices if detected)
|
|
shadowSize: (Point)
|
|
shadowAnchor: (Point)
|
|
*/
|
|
className: ''
|
|
},
|
|
|
|
initialize: function (options) {
|
|
L.setOptions(this, options);
|
|
},
|
|
|
|
createIcon: function () {
|
|
return this._createIcon('icon');
|
|
},
|
|
|
|
createShadow: function () {
|
|
return this._createIcon('shadow');
|
|
},
|
|
|
|
_createIcon: function (name) {
|
|
var src = this._getIconUrl(name);
|
|
|
|
if (!src) {
|
|
if (name === 'icon') {
|
|
throw new Error('iconUrl not set in Icon options (see the docs).');
|
|
}
|
|
return null;
|
|
}
|
|
|
|
var img = this._createImg(src);
|
|
this._setIconStyles(img, name);
|
|
|
|
return img;
|
|
},
|
|
|
|
_setIconStyles: function (img, name) {
|
|
var options = this.options,
|
|
size = L.point(options[name + 'Size']),
|
|
anchor;
|
|
|
|
if (name === 'shadow') {
|
|
anchor = L.point(options.shadowAnchor || options.iconAnchor);
|
|
} else {
|
|
anchor = L.point(options.iconAnchor);
|
|
}
|
|
|
|
if (!anchor && size) {
|
|
anchor = size.divideBy(2, true);
|
|
}
|
|
|
|
img.className = 'leaflet-marker-' + name + ' ' + options.className;
|
|
|
|
if (anchor) {
|
|
img.style.marginLeft = (-anchor.x) + 'px';
|
|
img.style.marginTop = (-anchor.y) + 'px';
|
|
}
|
|
|
|
if (size) {
|
|
img.style.width = size.x + 'px';
|
|
img.style.height = size.y + 'px';
|
|
}
|
|
},
|
|
|
|
_createImg: function (src) {
|
|
var el;
|
|
|
|
if (!L.Browser.ie6) {
|
|
el = document.createElement('img');
|
|
el.src = src;
|
|
} else {
|
|
el = document.createElement('div');
|
|
el.style.filter =
|
|
'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '")';
|
|
}
|
|
return el;
|
|
},
|
|
|
|
_getIconUrl: function (name) {
|
|
if (L.Browser.retina && this.options[name + 'RetinaUrl']) {
|
|
return this.options[name + 'RetinaUrl'];
|
|
}
|
|
return this.options[name + 'Url'];
|
|
}
|
|
});
|
|
|
|
L.icon = function (options) {
|
|
return new L.Icon(options);
|
|
};
|