+ this._crs = this.options.crs || map.options.crs;
+ this._wmsVersion = parseFloat(this.wmsParams.version);
+
+ var projectionKey = this._wmsVersion >= 1.3 ? 'crs' : 'srs';
+ this.wmsParams[projectionKey] = this._crs.code;
+
+ TileLayer.prototype.onAdd.call(this, map);
+ },
+
+ getTileUrl: function (coords) {
+
+ var tileBounds = this._tileCoordsToBounds(coords),
+ nw = this._crs.project(tileBounds.getNorthWest()),
+ se = this._crs.project(tileBounds.getSouthEast()),
+
+ bbox = (this._wmsVersion >= 1.3 && this._crs === EPSG4326 ?
+ [se.y, nw.x, nw.y, se.x] :
+ [nw.x, se.y, se.x, nw.y]).join(','),
+
+ url = TileLayer.prototype.getTileUrl.call(this, coords);
+
+ return url +
+ getParamString(this.wmsParams, url, this.options.uppercase) +
+ (this.options.uppercase ? '&BBOX=' : '&bbox=') + bbox;
+ },
+
+ // @method setParams(params: Object, noRedraw?: Boolean): this
+ // Merges an object with the new parameters and re-requests tiles on the current screen (unless `noRedraw` was set to true).
+ setParams: function (params, noRedraw) {
+
+ extend(this.wmsParams, params);
+
+ if (!noRedraw) {
+ this.redraw();
+ }
+
+ return this;
+ }
+});
+
+
+// @factory L.tileLayer.wms(baseUrl: String, options: TileLayer.WMS options)
+// Instantiates a WMS tile layer object given a base URL of the WMS service and a WMS parameters/options object.
+function tileLayerWMS(url, options) {
+ return new TileLayerWMS(url, options);
+}
+
+TileLayer.WMS = TileLayerWMS;
+tileLayer.wms = tileLayerWMS;
+
+/*
+ * @class Renderer
+ * @inherits Layer
+ * @aka L.Renderer
+ *
+ * Base class for vector renderer implementations (`SVG`, `Canvas`). Handles the
+ * DOM container of the renderer, its bounds, and its zoom animation.
+ *
+ * A `Renderer` works as an implicit layer group for all `Path`s - the renderer
+ * itself can be added or removed to the map. All paths use a renderer, which can
+ * be implicit (the map will decide the type of renderer and use it automatically)
+ * or explicit (using the [`renderer`](#path-renderer) option of the path).
+ *
+ * Do not use this class directly, use `SVG` and `Canvas` instead.
+ *
+ * @event update: Event
+ * Fired when the renderer updates its bounds, center and zoom, for example when
+ * its map has moved
+ */
+
+var Renderer = Layer.extend({
+
+ // @section
+ // @aka Renderer options
+ options: {
+ // @option padding: Number = 0.1
+ // How much to extend the clip area around the map view (relative to its size)
+ // e.g. 0.1 would be 10% of map view in each direction
+ padding: 0.1
+ },
+
+ initialize: function (options) {
+ setOptions(this, options);
+ stamp(this);
+ this._layers = this._layers || {};
+ },
+
+ onAdd: function () {
+ if (!this._container) {
+ this._initContainer(); // defined by renderer implementations
+
+ if (this._zoomAnimated) {
+ addClass(this._container, 'leaflet-zoom-animated');
+ }
+ }
+
+ this.getPane().appendChild(this._container);
+ this._update();
+ this.on('update', this._updatePaths, this);
+ },
+
+ onRemove: function () {
+ this.off('update', this._updatePaths, this);
+ this._destroyContainer();
+ },
+
+ getEvents: function () {
+ var events = {
+ viewreset: this._reset,
+ zoom: this._onZoom,
+ moveend: this._update,
+ zoomend: this._onZoomEnd
+ };
+ if (this._zoomAnimated) {
+ events.zoomanim = this._onAnimZoom;
+ }
+ return events;
+ },
+
+ _onAnimZoom: function (ev) {
+ this._updateTransform(ev.center, ev.zoom);
+ },
+
+ _onZoom: function () {
+ this._updateTransform(this._map.getCenter(), this._map.getZoom());
+ },
+
+ _updateTransform: function (center, zoom) {
+ var scale = this._map.getZoomScale(zoom, this._zoom),
+ position = getPosition(this._container),
+ viewHalf = this._map.getSize().multiplyBy(0.5 + this.options.padding),
+ currentCenterPoint = this._map.project(this._center, zoom),
+ destCenterPoint = this._map.project(center, zoom),
+ centerOffset = destCenterPoint.subtract(currentCenterPoint),
+
+ topLeftOffset = viewHalf.multiplyBy(-scale).add(position).add(viewHalf).subtract(centerOffset);
+
+ if (any3d) {
+ setTransform(this._container, topLeftOffset, scale);
+ } else {
+ setPosition(this._container, topLeftOffset);
+ }
+ },
+
+ _reset: function () {
+ this._update();
+ this._updateTransform(this._center, this._zoom);
+
+ for (var id in this._layers) {
+ this._layers[id]._reset();
+ }
+ },
+
+ _onZoomEnd: function () {
+ for (var id in this._layers) {
+ this._layers[id]._project();
+ }
+ },
+
+ _updatePaths: function () {
+ for (var id in this._layers) {
+ this._layers[id]._update();
+ }
+ },
+
+ _update: function () {
+ // Update pixel bounds of renderer container (for positioning/sizing/clipping later)
+ // Subclasses are responsible of firing the 'update' event.
+ var p = this.options.padding,
+ size = this._map.getSize(),
+ min = this._map.containerPointToLayerPoint(size.multiplyBy(-p)).round();
+
+ this._bounds = new Bounds(min, min.add(size.multiplyBy(1 + p * 2)).round());
+
+ this._center = this._map.getCenter();
+ this._zoom = this._map.getZoom();
+ }
+});
+
+/*
+ * @class Canvas
+ * @inherits Renderer
+ * @aka L.Canvas
+ *
+ * Allows vector layers to be displayed with [`<canvas>`](https://developer.mozilla.org/docs/Web/API/Canvas_API).
+ * Inherits `Renderer`.
+ *
+ * Due to [technical limitations](http://caniuse.com/#search=canvas), Canvas is not
+ * available in all web browsers, notably IE8, and overlapping geometries might
+ * not display properly in some edge cases.
+ *
+ * @example
+ *
+ * Use Canvas by default for all paths in the map:
+ *
+ * ```js
+ * var map = L.map('map', {
+ * renderer: L.canvas()
+ * });
+ * ```
+ *
+ * Use a Canvas renderer with extra padding for specific vector geometries:
+ *
+ * ```js
+ * var map = L.map('map');
+ * var myRenderer = L.canvas({ padding: 0.5 });
+ * var line = L.polyline( coordinates, { renderer: myRenderer } );
+ * var circle = L.circle( center, { renderer: myRenderer } );
+ * ```
+ */
+
+var Canvas = Renderer.extend({
+ getEvents: function () {
+ var events = Renderer.prototype.getEvents.call(this);
+ events.viewprereset = this._onViewPreReset;
+ return events;
+ },
+
+ _onViewPreReset: function () {
+ // Set a flag so that a viewprereset+moveend+viewreset only updates&redraws once
+ this._postponeUpdatePaths = true;
+ },
+
+ onAdd: function () {
+ Renderer.prototype.onAdd.call(this);
+
+ // Redraw vectors since canvas is cleared upon removal,
+ // in case of removing the renderer itself from the map.
+ this._draw();
+ },
+
+ _initContainer: function () {
+ var container = this._container = document.createElement('canvas');
+
+ on(container, 'mousemove', throttle(this._onMouseMove, 32, this), this);
+ on(container, 'click dblclick mousedown mouseup contextmenu', this._onClick, this);
+ on(container, 'mouseout', this._handleMouseOut, this);
+
+ this._ctx = container.getContext('2d');
+ },
+
+ _destroyContainer: function () {
+ delete this._ctx;
+ remove(this._container);
+ off(this._container);
+ delete this._container;
+ },
+
+ _updatePaths: function () {
+ if (this._postponeUpdatePaths) { return; }
+
+ var layer;
+ this._redrawBounds = null;
+ for (var id in this._layers) {
+ layer = this._layers[id];
+ layer._update();
+ }
+ this._redraw();
+ },
+
+ _update: function () {
+ if (this._map._animatingZoom && this._bounds) { return; }
+
+ this._drawnLayers = {};
+
+ Renderer.prototype._update.call(this);
+
+ var b = this._bounds,
+ container = this._container,
+ size = b.getSize(),
+ m = retina ? 2 : 1;
+
+ setPosition(container, b.min);
+
+ // set canvas size (also clearing it); use double size on retina
+ container.width = m * size.x;
+ container.height = m * size.y;
+ container.style.width = size.x + 'px';
+ container.style.height = size.y + 'px';
+
+ if (retina) {
+ this._ctx.scale(2, 2);
+ }
+
+ // translate so we use the same path coordinates after canvas element moves
+ this._ctx.translate(-b.min.x, -b.min.y);
+
+ // Tell paths to redraw themselves
+ this.fire('update');
+ },
+
+ _reset: function () {
+ Renderer.prototype._reset.call(this);
+
+ if (this._postponeUpdatePaths) {
+ this._postponeUpdatePaths = false;
+ this._updatePaths();
+ }
+ },
+
+ _initPath: function (layer) {
+ this._updateDashArray(layer);
+ this._layers[stamp(layer)] = layer;
+
+ var order = layer._order = {
+ layer: layer,
+ prev: this._drawLast,
+ next: null
+ };
+ if (this._drawLast) { this._drawLast.next = order; }
+ this._drawLast = order;
+ this._drawFirst = this._drawFirst || this._drawLast;
+ },
+
+ _addPath: function (layer) {
+ this._requestRedraw(layer);
+ },
+
+ _removePath: function (layer) {
+ var order = layer._order;
+ var next = order.next;
+ var prev = order.prev;
+
+ if (next) {
+ next.prev = prev;
+ } else {
+ this._drawLast = prev;
+ }
+ if (prev) {
+ prev.next = next;
+ } else {
+ this._drawFirst = next;
+ }
+
+ delete layer._order;
+
+ delete this._layers[L.stamp(layer)];
+
+ this._requestRedraw(layer);
+ },
+
+ _updatePath: function (layer) {
+ // Redraw the union of the layer's old pixel
+ // bounds and the new pixel bounds.
+ this._extendRedrawBounds(layer);
+ layer._project();
+ layer._update();
+ // The redraw will extend the redraw bounds
+ // with the new pixel bounds.
+ this._requestRedraw(layer);
+ },
+
+ _updateStyle: function (layer) {
+ this._updateDashArray(layer);
+ this._requestRedraw(layer);
+ },
+
+ _updateDashArray: function (layer) {
+ if (layer.options.dashArray) {
+ var parts = layer.options.dashArray.split(','),
+ dashArray = [],
+ i;
+ for (i = 0; i < parts.length; i++) {
+ dashArray.push(Number(parts[i]));
+ }
+ layer.options._dashArray = dashArray;
+ }
+ },
+
+ _requestRedraw: function (layer) {
+ if (!this._map) { return; }
+
+ this._extendRedrawBounds(layer);
+ this._redrawRequest = this._redrawRequest || requestAnimFrame(this._redraw, this);
+ },
+
+ _extendRedrawBounds: function (layer) {
+ if (layer._pxBounds) {
+ var padding = (layer.options.weight || 0) + 1;
+ this._redrawBounds = this._redrawBounds || new Bounds();
+ this._redrawBounds.extend(layer._pxBounds.min.subtract([padding, padding]));
+ this._redrawBounds.extend(layer._pxBounds.max.add([padding, padding]));
+ }
+ },
+
+ _redraw: function () {
+ this._redrawRequest = null;
+
+ if (this._redrawBounds) {
+ this._redrawBounds.min._floor();
+ this._redrawBounds.max._ceil();
+ }
+
+ this._clear(); // clear layers in redraw bounds
+ this._draw(); // draw layers
+
+ this._redrawBounds = null;
+ },
+
+ _clear: function () {
+ var bounds = this._redrawBounds;
+ if (bounds) {
+ var size = bounds.getSize();
+ this._ctx.clearRect(bounds.min.x, bounds.min.y, size.x, size.y);
+ } else {
+ this._ctx.clearRect(0, 0, this._container.width, this._container.height);
+ }
+ },
+
+ _draw: function () {
+ var layer, bounds = this._redrawBounds;
+ this._ctx.save();
+ if (bounds) {
+ var size = bounds.getSize();
+ this._ctx.beginPath();
+ this._ctx.rect(bounds.min.x, bounds.min.y, size.x, size.y);
+ this._ctx.clip();
+ }
+
+ this._drawing = true;
+
+ for (var order = this._drawFirst; order; order = order.next) {
+ layer = order.layer;
+ if (!bounds || (layer._pxBounds && layer._pxBounds.intersects(bounds))) {
+ layer._updatePath();
+ }
+ }
+
+ this._drawing = false;
+
+ this._ctx.restore(); // Restore state before clipping.
+ },
+
+ _updatePoly: function (layer, closed) {
+ if (!this._drawing) { return; }
+
+ var i, j, len2, p,
+ parts = layer._parts,
+ len = parts.length,
+ ctx = this._ctx;
+
+ if (!len) { return; }
+
+ this._drawnLayers[layer._leaflet_id] = layer;
+
+ ctx.beginPath();
+
+ for (i = 0; i < len; i++) {
+ for (j = 0, len2 = parts[i].length; j < len2; j++) {
+ p = parts[i][j];
+ ctx[j ? 'lineTo' : 'moveTo'](p.x, p.y);
+ }
+ if (closed) {
+ ctx.closePath();
+ }
+ }
+
+ this._fillStroke(ctx, layer);
+
+ // TODO optimization: 1 fill/stroke for all features with equal style instead of 1 for each feature
+ },
+
+ _updateCircle: function (layer) {
+
+ if (!this._drawing || layer._empty()) { return; }
+
+ var p = layer._point,
+ ctx = this._ctx,
+ r = layer._radius,
+ s = (layer._radiusY || r) / r;
+
+ this._drawnLayers[layer._leaflet_id] = layer;
+
+ if (s !== 1) {
+ ctx.save();
+ ctx.scale(1, s);
+ }
+
+ ctx.beginPath();
+ ctx.arc(p.x, p.y / s, r, 0, Math.PI * 2, false);
+
+ if (s !== 1) {
+ ctx.restore();
+ }
+
+ this._fillStroke(ctx, layer);
+ },
+
+ _fillStroke: function (ctx, layer) {
+ var options = layer.options;
+
+ if (options.fill) {
+ ctx.globalAlpha = options.fillOpacity;
+ ctx.fillStyle = options.fillColor || options.color;
+ ctx.fill(options.fillRule || 'evenodd');
+ }
+
+ if (options.stroke && options.weight !== 0) {
+ if (ctx.setLineDash) {
+ ctx.setLineDash(layer.options && layer.options._dashArray || []);
+ }
+ ctx.globalAlpha = options.opacity;
+ ctx.lineWidth = options.weight;
+ ctx.strokeStyle = options.color;
+ ctx.lineCap = options.lineCap;
+ ctx.lineJoin = options.lineJoin;
+ ctx.stroke();
+ }
+ },
+
+ // Canvas obviously doesn't have mouse events for individual drawn objects,
+ // so we emulate that by calculating what's under the mouse on mousemove/click manually
+
+ _onClick: function (e) {
+ var point = this._map.mouseEventToLayerPoint(e), layer, clickedLayer;
+
+ for (var order = this._drawFirst; order; order = order.next) {
+ layer = order.layer;
+ if (layer.options.interactive && layer._containsPoint(point) && !this._map._draggableMoved(layer)) {
+ clickedLayer = layer;
+ }
+ }
+ if (clickedLayer) {
+ fakeStop(e);
+ this._fireEvent([clickedLayer], e);
+ }
+ },
+
+ _onMouseMove: function (e) {
+ if (!this._map || this._map.dragging.moving() || this._map._animatingZoom) { return; }
+
+ var point = this._map.mouseEventToLayerPoint(e);
+ this._handleMouseHover(e, point);
+ },
+
+
+ _handleMouseOut: function (e) {
+ var layer = this._hoveredLayer;
+ if (layer) {
+ // if we're leaving the layer, fire mouseout
+ removeClass(this._container, 'leaflet-interactive');
+ this._fireEvent([layer], e, 'mouseout');
+ this._hoveredLayer = null;
+ }
+ },
+
+ _handleMouseHover: function (e, point) {
+ var layer, candidateHoveredLayer;
+
+ for (var order = this._drawFirst; order; order = order.next) {
+ layer = order.layer;
+ if (layer.options.interactive && layer._containsPoint(point)) {
+ candidateHoveredLayer = layer;
+ }
+ }
+
+ if (candidateHoveredLayer !== this._hoveredLayer) {
+ this._handleMouseOut(e);
+
+ if (candidateHoveredLayer) {
+ addClass(this._container, 'leaflet-interactive'); // change cursor
+ this._fireEvent([candidateHoveredLayer], e, 'mouseover');
+ this._hoveredLayer = candidateHoveredLayer;
+ }
+ }
+
+ if (this._hoveredLayer) {
+ this._fireEvent([this._hoveredLayer], e);
+ }
+ },
+
+ _fireEvent: function (layers, e, type) {
+ this._map._fireDOMEvent(e, type || e.type, layers);
+ },
+
+ _bringToFront: function (layer) {
+ var order = layer._order;
+ var next = order.next;
+ var prev = order.prev;
+
+ if (next) {
+ next.prev = prev;
+ } else {
+ // Already last
+ return;
+ }
+ if (prev) {
+ prev.next = next;
+ } else if (next) {
+ // Update first entry unless this is the
+ // signle entry
+ this._drawFirst = next;
+ }
+
+ order.prev = this._drawLast;
+ this._drawLast.next = order;
+
+ order.next = null;
+ this._drawLast = order;
+
+ this._requestRedraw(layer);
+ },
+
+ _bringToBack: function (layer) {
+ var order = layer._order;
+ var next = order.next;
+ var prev = order.prev;
+
+ if (prev) {
+ prev.next = next;
+ } else {
+ // Already first
+ return;
+ }
+ if (next) {
+ next.prev = prev;
+ } else if (prev) {
+ // Update last entry unless this is the
+ // signle entry
+ this._drawLast = prev;
+ }
+
+ order.prev = null;
+
+ order.next = this._drawFirst;
+ this._drawFirst.prev = order;
+ this._drawFirst = order;
+
+ this._requestRedraw(layer);
+ }
+});
+
+// @factory L.canvas(options?: Renderer options)
+// Creates a Canvas renderer with the given options.
+function canvas$1(options) {
+ return canvas ? new Canvas(options) : null;
+}
+
+/*
+ * Thanks to Dmitry Baranovsky and his Raphael library for inspiration!
+ */
+
+
+var vmlCreate = (function () {
+ try {
+ document.namespaces.add('lvml', 'urn:schemas-microsoft-com:vml');
+ return function (name) {
+ return document.createElement('<lvml:' + name + ' class="lvml">');
+ };
+ } catch (e) {
+ return function (name) {
+ return document.createElement('<' + name + ' xmlns="urn:schemas-microsoft.com:vml" class="lvml">');
+ };
+ }
+})();
+
+
+/*
+ * @class SVG
+ *
+ * Although SVG is not available on IE7 and IE8, these browsers support [VML](https://en.wikipedia.org/wiki/Vector_Markup_Language), and the SVG renderer will fall back to VML in this case.
+ *
+ * VML was deprecated in 2012, which means VML functionality exists only for backwards compatibility
+ * with old versions of Internet Explorer.
+ */
+
+// mixin to redefine some SVG methods to handle VML syntax which is similar but with some differences
+var vmlMixin = {
+
+ _initContainer: function () {
+ this._container = create$1('div', 'leaflet-vml-container');
+ },
+
+ _update: function () {
+ if (this._map._animatingZoom) { return; }
+ Renderer.prototype._update.call(this);
+ this.fire('update');
+ },
+
+ _initPath: function (layer) {
+ var container = layer._container = vmlCreate('shape');
+
+ addClass(container, 'leaflet-vml-shape ' + (this.options.className || ''));
+
+ container.coordsize = '1 1';
+
+ layer._path = vmlCreate('path');
+ container.appendChild(layer._path);
+
+ this._updateStyle(layer);
+ this._layers[stamp(layer)] = layer;
+ },
+
+ _addPath: function (layer) {
+ var container = layer._container;
+ this._container.appendChild(container);
+
+ if (layer.options.interactive) {
+ layer.addInteractiveTarget(container);
+ }
+ },
+
+ _removePath: function (layer) {
+ var container = layer._container;
+ remove(container);
+ layer.removeInteractiveTarget(container);
+ delete this._layers[stamp(layer)];
+ },
+
+ _updateStyle: function (layer) {
+ var stroke = layer._stroke,
+ fill = layer._fill,
+ options = layer.options,
+ container = layer._container;
+
+ container.stroked = !!options.stroke;
+ container.filled = !!options.fill;
+
+ if (options.stroke) {
+ if (!stroke) {
+ stroke = layer._stroke = vmlCreate('stroke');
+ }
+ container.appendChild(stroke);
+ stroke.weight = options.weight + 'px';
+ stroke.color = options.color;
+ stroke.opacity = options.opacity;
+
+ if (options.dashArray) {
+ stroke.dashStyle = isArray(options.dashArray) ?
+ options.dashArray.join(' ') :
+ options.dashArray.replace(/( *, *)/g, ' ');
+ } else {
+ stroke.dashStyle = '';
+ }
+ stroke.endcap = options.lineCap.replace('butt', 'flat');
+ stroke.joinstyle = options.lineJoin;
+
+ } else if (stroke) {
+ container.removeChild(stroke);
+ layer._stroke = null;
+ }
+
+ if (options.fill) {
+ if (!fill) {
+ fill = layer._fill = vmlCreate('fill');
+ }
+ container.appendChild(fill);
+ fill.color = options.fillColor || options.color;
+ fill.opacity = options.fillOpacity;
+
+ } else if (fill) {
+ container.removeChild(fill);
+ layer._fill = null;
+ }
+ },
+
+ _updateCircle: function (layer) {
+ var p = layer._point.round(),
+ r = Math.round(layer._radius),
+ r2 = Math.round(layer._radiusY || r);
+
+ this._setPath(layer, layer._empty() ? 'M0 0' :
+ 'AL ' + p.x + ',' + p.y + ' ' + r + ',' + r2 + ' 0,' + (65535 * 360));
+ },
+
+ _setPath: function (layer, path) {
+ layer._path.v = path;
+ },
+
+ _bringToFront: function (layer) {
+ toFront(layer._container);
+ },
+
+ _bringToBack: function (layer) {
+ toBack(layer._container);
+ }
+};
+
+var create$2 = vml ? vmlCreate : svgCreate;
+
+/*
+ * @class SVG
+ * @inherits Renderer
+ * @aka L.SVG
+ *
+ * Allows vector layers to be displayed with [SVG](https://developer.mozilla.org/docs/Web/SVG).
+ * Inherits `Renderer`.
+ *
+ * Due to [technical limitations](http://caniuse.com/#search=svg), SVG is not
+ * available in all web browsers, notably Android 2.x and 3.x.
+ *
+ * Although SVG is not available on IE7 and IE8, these browsers support
+ * [VML](https://en.wikipedia.org/wiki/Vector_Markup_Language)
+ * (a now deprecated technology), and the SVG renderer will fall back to VML in
+ * this case.
+ *
+ * @example
+ *
+ * Use SVG by default for all paths in the map:
+ *
+ * ```js
+ * var map = L.map('map', {
+ * renderer: L.svg()
+ * });
+ * ```
+ *
+ * Use a SVG renderer with extra padding for specific vector geometries:
+ *
+ * ```js
+ * var map = L.map('map');
+ * var myRenderer = L.svg({ padding: 0.5 });
+ * var line = L.polyline( coordinates, { renderer: myRenderer } );
+ * var circle = L.circle( center, { renderer: myRenderer } );
+ * ```
+ */
+
+var SVG = Renderer.extend({
+
+ getEvents: function () {
+ var events = Renderer.prototype.getEvents.call(this);
+ events.zoomstart = this._onZoomStart;
+ return events;
+ },
+
+ _initContainer: function () {
+ this._container = create$2('svg');
+
+ // makes it possible to click through svg root; we'll reset it back in individual paths
+ this._container.setAttribute('pointer-events', 'none');
+
+ this._rootGroup = create$2('g');
+ this._container.appendChild(this._rootGroup);
+ },
+
+ _destroyContainer: function () {
+ remove(this._container);
+ off(this._container);
+ delete this._container;
+ delete this._rootGroup;
+ },
+
+ _onZoomStart: function () {
+ // Drag-then-pinch interactions might mess up the center and zoom.
+ // In this case, the easiest way to prevent this is re-do the renderer
+ // bounds and padding when the zooming starts.
+ this._update();
+ },
+
+ _update: function () {
+ if (this._map._animatingZoom && this._bounds) { return; }
+
+ Renderer.prototype._update.call(this);
+
+ var b = this._bounds,
+ size = b.getSize(),
+ container = this._container;
+
+ // set size of svg-container if changed
+ if (!this._svgSize || !this._svgSize.equals(size)) {
+ this._svgSize = size;
+ container.setAttribute('width', size.x);
+ container.setAttribute('height', size.y);
+ }
+
+ // movement: update container viewBox so that we don't have to change coordinates of individual layers
+ setPosition(container, b.min);
+ container.setAttribute('viewBox', [b.min.x, b.min.y, size.x, size.y].join(' '));
+
+ this.fire('update');
+ },
+
+ // methods below are called by vector layers implementations
+
+ _initPath: function (layer) {
+ var path = layer._path = create$2('path');
+
+ // @namespace Path
+ // @option className: String = null
+ // Custom class name set on an element. Only for SVG renderer.
+ if (layer.options.className) {
+ addClass(path, layer.options.className);
+ }
+
+ if (layer.options.interactive) {
+ addClass(path, 'leaflet-interactive');
+ }
+
+ this._updateStyle(layer);
+ this._layers[stamp(layer)] = layer;
+ },
+
+ _addPath: function (layer) {
+ if (!this._rootGroup) { this._initContainer(); }
+ this._rootGroup.appendChild(layer._path);
+ layer.addInteractiveTarget(layer._path);
+ },
+
+ _removePath: function (layer) {
+ remove(layer._path);
+ layer.removeInteractiveTarget(layer._path);
+ delete this._layers[stamp(layer)];
+ },
+
+ _updatePath: function (layer) {
+ layer._project();
+ layer._update();
+ },
+
+ _updateStyle: function (layer) {
+ var path = layer._path,
+ options = layer.options;
+
+ if (!path) { return; }
+
+ if (options.stroke) {
+ path.setAttribute('stroke', options.color);
+ path.setAttribute('stroke-opacity', options.opacity);
+ path.setAttribute('stroke-width', options.weight);
+ path.setAttribute('stroke-linecap', options.lineCap);
+ path.setAttribute('stroke-linejoin', options.lineJoin);
+
+ if (options.dashArray) {
+ path.setAttribute('stroke-dasharray', options.dashArray);
+ } else {
+ path.removeAttribute('stroke-dasharray');
+ }
+
+ if (options.dashOffset) {
+ path.setAttribute('stroke-dashoffset', options.dashOffset);
+ } else {
+ path.removeAttribute('stroke-dashoffset');
+ }
+ } else {
+ path.setAttribute('stroke', 'none');
+ }
+
+ if (options.fill) {
+ path.setAttribute('fill', options.fillColor || options.color);
+ path.setAttribute('fill-opacity', options.fillOpacity);
+ path.setAttribute('fill-rule', options.fillRule || 'evenodd');
+ } else {
+ path.setAttribute('fill', 'none');
+ }
+ },
+
+ _updatePoly: function (layer, closed) {
+ this._setPath(layer, pointsToPath(layer._parts, closed));
+ },
+
+ _updateCircle: function (layer) {
+ var p = layer._point,
+ r = layer._radius,
+ r2 = layer._radiusY || r,
+ arc = 'a' + r + ',' + r2 + ' 0 1,0 ';
+
+ // drawing a circle with two half-arcs
+ var d = layer._empty() ? 'M0 0' :
+ 'M' + (p.x - r) + ',' + p.y +
+ arc + (r * 2) + ',0 ' +
+ arc + (-r * 2) + ',0 ';
+
+ this._setPath(layer, d);
+ },
+
+ _setPath: function (layer, path) {
+ layer._path.setAttribute('d', path);
+ },
+
+ // SVG does not have the concept of zIndex so we resort to changing the DOM order of elements
+ _bringToFront: function (layer) {
+ toFront(layer._path);
+ },
+
+ _bringToBack: function (layer) {
+ toBack(layer._path);
+ }
+});
+
+if (vml) {
+ SVG.include(vmlMixin);
+}
+
+// @factory L.svg(options?: Renderer options)
+// Creates a SVG renderer with the given options.
+function svg$1(options) {
+ return svg || vml ? new SVG(options) : null;
+}
+
+Map.include({
+ // @namespace Map; @method getRenderer(layer: Path): Renderer
+ // Returns the instance of `Renderer` that should be used to render the given
+ // `Path`. It will ensure that the `renderer` options of the map and paths
+ // are respected, and that the renderers do exist on the map.
+ getRenderer: function (layer) {
+ // @namespace Path; @option renderer: Renderer
+ // Use this specific instance of `Renderer` for this path. Takes
+ // precedence over the map's [default renderer](#map-renderer).
+ var renderer = layer.options.renderer || this._getPaneRenderer(layer.options.pane) || this.options.renderer || this._renderer;
+
+ if (!renderer) {
+ // @namespace Map; @option preferCanvas: Boolean = false
+ // Whether `Path`s should be rendered on a `Canvas` renderer.
+ // By default, all `Path`s are rendered in a `SVG` renderer.
+ renderer = this._renderer = (this.options.preferCanvas && canvas$1()) || svg$1();
+ }
+
+ if (!this.hasLayer(renderer)) {
+ this.addLayer(renderer);
+ }
+ return renderer;
+ },
+
+ _getPaneRenderer: function (name) {
+ if (name === 'overlayPane' || name === undefined) {
+ return false;
+ }
+
+ var renderer = this._paneRenderers[name];
+ if (renderer === undefined) {
+ renderer = (SVG && svg$1({pane: name})) || (Canvas && canvas$1({pane: name}));
+ this._paneRenderers[name] = renderer;
+ }
+ return renderer;
+ }
+});
+
+/*
+ * L.Rectangle extends Polygon and creates a rectangle when passed a LatLngBounds object.
+ */
+
+/*
+ * @class Rectangle
+ * @aka L.Retangle
+ * @inherits Polygon
+ *
+ * A class for drawing rectangle overlays on a map. Extends `Polygon`.
+ *
+ * @example
+ *
+ * ```js
+ * // define rectangle geographical bounds
+ * var bounds = [[54.559322, -5.767822], [56.1210604, -3.021240]];
+ *
+ * // create an orange rectangle
+ * L.rectangle(bounds, {color: "#ff7800", weight: 1}).addTo(map);
+ *
+ * // zoom the map to the rectangle bounds
+ * map.fitBounds(bounds);
+ * ```
+ *
+ */
+
+
+var Rectangle = Polygon.extend({
+ initialize: function (latLngBounds, options) {
+ Polygon.prototype.initialize.call(this, this._boundsToLatLngs(latLngBounds), options);
+ },
+
+ // @method setBounds(latLngBounds: LatLngBounds): this
+ // Redraws the rectangle with the passed bounds.
+ setBounds: function (latLngBounds) {
+ return this.setLatLngs(this._boundsToLatLngs(latLngBounds));
+ },
+
+ _boundsToLatLngs: function (latLngBounds) {
+ latLngBounds = toLatLngBounds(latLngBounds);
+ return [
+ latLngBounds.getSouthWest(),
+ latLngBounds.getNorthWest(),
+ latLngBounds.getNorthEast(),
+ latLngBounds.getSouthEast()
+ ];
+ }
+});
+
+
+// @factory L.rectangle(latLngBounds: LatLngBounds, options?: Polyline options)
+function rectangle(latLngBounds, options) {
+ return new Rectangle(latLngBounds, options);
+}
+
+SVG.create = create$2;
+SVG.pointsToPath = pointsToPath;
+
+GeoJSON.geometryToLayer = geometryToLayer;
+GeoJSON.coordsToLatLng = coordsToLatLng;
+GeoJSON.coordsToLatLngs = coordsToLatLngs;
+GeoJSON.latLngToCoords = latLngToCoords;
+GeoJSON.latLngsToCoords = latLngsToCoords;
+GeoJSON.getFeature = getFeature;
+GeoJSON.asFeature = asFeature;
+
+/*
+ * L.Handler.BoxZoom is used to add shift-drag zoom interaction to the map
+ * (zoom to a selected bounding box), enabled by default.
+ */
+
+// @namespace Map
+// @section Interaction Options
+Map.mergeOptions({
+ // @option boxZoom: Boolean = true
+ // Whether the map can be zoomed to a rectangular area specified by
+ // dragging the mouse while pressing the shift key.
+ boxZoom: true
+});
+
+var BoxZoom = Handler.extend({
+ initialize: function (map) {
+ this._map = map;
+ this._container = map._container;
+ this._pane = map._panes.overlayPane;
+ this._resetStateTimeout = 0;
+ map.on('unload', this._destroy, this);
+ },
+
+ addHooks: function () {
+ on(this._container, 'mousedown', this._onMouseDown, this);
+ },
+
+ removeHooks: function () {
+ off(this._container, 'mousedown', this._onMouseDown, this);
+ },
+
+ moved: function () {
+ return this._moved;
+ },
+
+ _destroy: function () {
+ remove(this._pane);
+ delete this._pane;
+ },
+
+ _resetState: function () {
+ this._resetStateTimeout = 0;
+ this._moved = false;
+ },
+
+ _clearDeferredResetState: function () {
+ if (this._resetStateTimeout !== 0) {
+ clearTimeout(this._resetStateTimeout);
+ this._resetStateTimeout = 0;
+ }
+ },
+
+ _onMouseDown: function (e) {
+ if (!e.shiftKey || ((e.which !== 1) && (e.button !== 1))) { return false; }
+
+ // Clear the deferred resetState if it hasn't executed yet, otherwise it
+ // will interrupt the interaction and orphan a box element in the container.
+ this._clearDeferredResetState();
+ this._resetState();
+
+ disableTextSelection();
+ disableImageDrag();
+
+ this._startPoint = this._map.mouseEventToContainerPoint(e);
+
+ on(document, {
+ contextmenu: stop,
+ mousemove: this._onMouseMove,
+ mouseup: this._onMouseUp,
+ keydown: this._onKeyDown
+ }, this);
+ },
+
+ _onMouseMove: function (e) {
+ if (!this._moved) {
+ this._moved = true;
+
+ this._box = create$1('div', 'leaflet-zoom-box', this._container);
+ addClass(this._container, 'leaflet-crosshair');
+
+ this._map.fire('boxzoomstart');
+ }
+
+ this._point = this._map.mouseEventToContainerPoint(e);
+
+ var bounds = new Bounds(this._point, this._startPoint),
+ size = bounds.getSize();
+
+ setPosition(this._box, bounds.min);
+
+ this._box.style.width = size.x + 'px';
+ this._box.style.height = size.y + 'px';
+ },
+
+ _finish: function () {
+ if (this._moved) {
+ remove(this._box);
+ removeClass(this._container, 'leaflet-crosshair');
+ }
+
+ enableTextSelection();
+ enableImageDrag();
+
+ off(document, {
+ contextmenu: stop,
+ mousemove: this._onMouseMove,
+ mouseup: this._onMouseUp,
+ keydown: this._onKeyDown
+ }, this);
+ },
+
+ _onMouseUp: function (e) {
+ if ((e.which !== 1) && (e.button !== 1)) { return; }
+
+ this._finish();
+
+ if (!this._moved) { return; }
+ // Postpone to next JS tick so internal click event handling
+ // still see it as "moved".
+ this._clearDeferredResetState();
+ this._resetStateTimeout = setTimeout(bind(this._resetState, this), 0);
+
+ var bounds = new LatLngBounds(
+ this._map.containerPointToLatLng(this._startPoint),
+ this._map.containerPointToLatLng(this._point));
+
+ this._map
+ .fitBounds(bounds)
+ .fire('boxzoomend', {boxZoomBounds: bounds});
+ },
+
+ _onKeyDown: function (e) {
+ if (e.keyCode === 27) {
+ this._finish();
+ }
+ }
+});
+
+// @section Handlers
+// @property boxZoom: Handler
+// Box (shift-drag with mouse) zoom handler.
+Map.addInitHook('addHandler', 'boxZoom', BoxZoom);
+
+/*
+ * L.Handler.DoubleClickZoom is used to handle double-click zoom on the map, enabled by default.
+ */
+
+// @namespace Map
+// @section Interaction Options
+
+Map.mergeOptions({
+ // @option doubleClickZoom: Boolean|String = true
+ // Whether the map can be zoomed in by double clicking on it and
+ // zoomed out by double clicking while holding shift. If passed
+ // `'center'`, double-click zoom will zoom to the center of the
+ // view regardless of where the mouse was.
+ doubleClickZoom: true
+});
+
+var DoubleClickZoom = Handler.extend({
+ addHooks: function () {
+ this._map.on('dblclick', this._onDoubleClick, this);
+ },
+
+ removeHooks: function () {
+ this._map.off('dblclick', this._onDoubleClick, this);
+ },
+
+ _onDoubleClick: function (e) {
+ var map = this._map,
+ oldZoom = map.getZoom(),
+ delta = map.options.zoomDelta,
+ zoom = e.originalEvent.shiftKey ? oldZoom - delta : oldZoom + delta;
+
+ if (map.options.doubleClickZoom === 'center') {
+ map.setZoom(zoom);
+ } else {
+ map.setZoomAround(e.containerPoint, zoom);
+ }
+ }
+});
+
+// @section Handlers
+//
+// Map properties include interaction handlers that allow you to control
+// interaction behavior in runtime, enabling or disabling certain features such
+// as dragging or touch zoom (see `Handler` methods). For example:
+//
+// ```js
+// map.doubleClickZoom.disable();
+// ```
+//
+// @property doubleClickZoom: Handler
+// Double click zoom handler.
+Map.addInitHook('addHandler', 'doubleClickZoom', DoubleClickZoom);
+
+/*
+ * L.Handler.MapDrag is used to make the map draggable (with panning inertia), enabled by default.
+ */
+
+// @namespace Map
+// @section Interaction Options
+Map.mergeOptions({
+ // @option dragging: Boolean = true
+ // Whether the map be draggable with mouse/touch or not.
+ dragging: true,
+
+ // @section Panning Inertia Options
+ // @option inertia: Boolean = *
+ // If enabled, panning of the map will have an inertia effect where
+ // the map builds momentum while dragging and continues moving in
+ // the same direction for some time. Feels especially nice on touch
+ // devices. Enabled by default unless running on old Android devices.
+ inertia: !android23,
+
+ // @option inertiaDeceleration: Number = 3000
+ // The rate with which the inertial movement slows down, in pixels/second².
+ inertiaDeceleration: 3400, // px/s^2
+
+ // @option inertiaMaxSpeed: Number = Infinity
+ // Max speed of the inertial movement, in pixels/second.
+ inertiaMaxSpeed: Infinity, // px/s
+
+ // @option easeLinearity: Number = 0.2
+ easeLinearity: 0.2,
+
+ // TODO refactor, move to CRS
+ // @option worldCopyJump: Boolean = false
+ // With this option enabled, the map tracks when you pan to another "copy"
+ // of the world and seamlessly jumps to the original one so that all overlays
+ // like markers and vector layers are still visible.
+ worldCopyJump: false,
+
+ // @option maxBoundsViscosity: Number = 0.0
+ // If `maxBounds` is set, this option will control how solid the bounds
+ // are when dragging the map around. The default value of `0.0` allows the
+ // user to drag outside the bounds at normal speed, higher values will
+ // slow down map dragging outside bounds, and `1.0` makes the bounds fully
+ // solid, preventing the user from dragging outside the bounds.
+ maxBoundsViscosity: 0.0
+});
+
+var Drag = Handler.extend({
+ addHooks: function () {
+ if (!this._draggable) {
+ var map = this._map;
+
+ this._draggable = new Draggable(map._mapPane, map._container);
+
+ this._draggable.on({
+ dragstart: this._onDragStart,
+ drag: this._onDrag,
+ dragend: this._onDragEnd
+ }, this);
+
+ this._draggable.on('predrag', this._onPreDragLimit, this);
+ if (map.options.worldCopyJump) {
+ this._draggable.on('predrag', this._onPreDragWrap, this);
+ map.on('zoomend', this._onZoomEnd, this);
+
+ map.whenReady(this._onZoomEnd, this);
+ }
+ }
+ addClass(this._map._container, 'leaflet-grab leaflet-touch-drag');
+ this._draggable.enable();
+ this._positions = [];
+ this._times = [];
+ },
+
+ removeHooks: function () {
+ removeClass(this._map._container, 'leaflet-grab');
+ removeClass(this._map._container, 'leaflet-touch-drag');
+ this._draggable.disable();
+ },
+
+ moved: function () {
+ return this._draggable && this._draggable._moved;
+ },
+
+ moving: function () {
+ return this._draggable && this._draggable._moving;
+ },
+
+ _onDragStart: function () {
+ var map = this._map;
+
+ map._stop();
+ if (this._map.options.maxBounds && this._map.options.maxBoundsViscosity) {
+ var bounds = toLatLngBounds(this._map.options.maxBounds);
+
+ this._offsetLimit = toBounds(
+ this._map.latLngToContainerPoint(bounds.getNorthWest()).multiplyBy(-1),
+ this._map.latLngToContainerPoint(bounds.getSouthEast()).multiplyBy(-1)
+ .add(this._map.getSize()));
+
+ this._viscosity = Math.min(1.0, Math.max(0.0, this._map.options.maxBoundsViscosity));
+ } else {
+ this._offsetLimit = null;
+ }
+
+ map
+ .fire('movestart')
+ .fire('dragstart');
+
+ if (map.options.inertia) {
+ this._positions = [];
+ this._times = [];
+ }
+ },
+
+ _onDrag: function (e) {
+ if (this._map.options.inertia) {
+ var time = this._lastTime = +new Date(),
+ pos = this._lastPos = this._draggable._absPos || this._draggable._newPos;
+
+ this._positions.push(pos);
+ this._times.push(time);
+
+ if (time - this._times[0] > 50) {
+ this._positions.shift();
+ this._times.shift();
+ }
+ }
+
+ this._map
+ .fire('move', e)
+ .fire('drag', e);
+ },
+
+ _onZoomEnd: function () {
+ var pxCenter = this._map.getSize().divideBy(2),
+ pxWorldCenter = this._map.latLngToLayerPoint([0, 0]);
+
+ this._initialWorldOffset = pxWorldCenter.subtract(pxCenter).x;
+ this._worldWidth = this._map.getPixelWorldBounds().getSize().x;
+ },
+
+ _viscousLimit: function (value, threshold) {
+ return value - (value - threshold) * this._viscosity;
+ },
+
+ _onPreDragLimit: function () {
+ if (!this._viscosity || !this._offsetLimit) { return; }
+
+ var offset = this._draggable._newPos.subtract(this._draggable._startPos);
+
+ var limit = this._offsetLimit;
+ if (offset.x < limit.min.x) { offset.x = this._viscousLimit(offset.x, limit.min.x); }
+ if (offset.y < limit.min.y) { offset.y = this._viscousLimit(offset.y, limit.min.y); }
+ if (offset.x > limit.max.x) { offset.x = this._viscousLimit(offset.x, limit.max.x); }
+ if (offset.y > limit.max.y) { offset.y = this._viscousLimit(offset.y, limit.max.y); }
+
+ this._draggable._newPos = this._draggable._startPos.add(offset);
+ },
+
+ _onPreDragWrap: function () {
+ // TODO refactor to be able to adjust map pane position after zoom
+ var worldWidth = this._worldWidth,
+ halfWidth = Math.round(worldWidth / 2),
+ dx = this._initialWorldOffset,
+ x = this._draggable._newPos.x,
+ newX1 = (x - halfWidth + dx) % worldWidth + halfWidth - dx,
+ newX2 = (x + halfWidth + dx) % worldWidth - halfWidth - dx,
+ newX = Math.abs(newX1 + dx) < Math.abs(newX2 + dx) ? newX1 : newX2;
+
+ this._draggable._absPos = this._draggable._newPos.clone();
+ this._draggable._newPos.x = newX;
+ },
+
+ _onDragEnd: function (e) {
+ var map = this._map,
+ options = map.options,
+
+ noInertia = !options.inertia || this._times.length < 2;
+
+ map.fire('dragend', e);
+
+ if (noInertia) {
+ map.fire('moveend');
+
+ } else {
+
+ var direction = this._lastPos.subtract(this._positions[0]),
+ duration = (this._lastTime - this._times[0]) / 1000,
+ ease = options.easeLinearity,
+
+ speedVector = direction.multiplyBy(ease / duration),
+ speed = speedVector.distanceTo([0, 0]),
+
+ limitedSpeed = Math.min(options.inertiaMaxSpeed, speed),
+ limitedSpeedVector = speedVector.multiplyBy(limitedSpeed / speed),
+
+ decelerationDuration = limitedSpeed / (options.inertiaDeceleration * ease),
+ offset = limitedSpeedVector.multiplyBy(-decelerationDuration / 2).round();
+
+ if (!offset.x && !offset.y) {
+ map.fire('moveend');
+
+ } else {
+ offset = map._limitOffset(offset, map.options.maxBounds);
+
+ requestAnimFrame(function () {
+ map.panBy(offset, {
+ duration: decelerationDuration,
+ easeLinearity: ease,
+ noMoveStart: true,
+ animate: true
+ });
+ });
+ }
+ }
+ }
+});
+
+// @section Handlers
+// @property dragging: Handler
+// Map dragging handler (by both mouse and touch).
+Map.addInitHook('addHandler', 'dragging', Drag);
+
+/*
+ * L.Map.Keyboard is handling keyboard interaction with the map, enabled by default.
+ */
+
+// @namespace Map
+// @section Keyboard Navigation Options
+Map.mergeOptions({
+ // @option keyboard: Boolean = true
+ // Makes the map focusable and allows users to navigate the map with keyboard
+ // arrows and `+`/`-` keys.
+ keyboard: true,
+
+ // @option keyboardPanDelta: Number = 80
+ // Amount of pixels to pan when pressing an arrow key.
+ keyboardPanDelta: 80
+});
+
+var Keyboard = Handler.extend({
+
+ keyCodes: {
+ left: [37],
+ right: [39],
+ down: [40],
+ up: [38],
+ zoomIn: [187, 107, 61, 171],
+ zoomOut: [189, 109, 54, 173]
+ },
+
+ initialize: function (map) {
+ this._map = map;
+
+ this._setPanDelta(map.options.keyboardPanDelta);
+ this._setZoomDelta(map.options.zoomDelta);
+ },
+
+ addHooks: function () {
+ var container = this._map._container;
+
+ // make the container focusable by tabbing
+ if (container.tabIndex <= 0) {
+ container.tabIndex = '0';
+ }
+
+ on(container, {
+ focus: this._onFocus,
+ blur: this._onBlur,
+ mousedown: this._onMouseDown
+ }, this);
+
+ this._map.on({
+ focus: this._addHooks,
+ blur: this._removeHooks
+ }, this);
+ },
+
+ removeHooks: function () {
+ this._removeHooks();
+
+ off(this._map._container, {
+ focus: this._onFocus,
+ blur: this._onBlur,
+ mousedown: this._onMouseDown
+ }, this);
+
+ this._map.off({
+ focus: this._addHooks,
+ blur: this._removeHooks
+ }, this);
+ },
+
+ _onMouseDown: function () {
+ if (this._focused) { return; }
+
+ var body = document.body,
+ docEl = document.documentElement,
+ top = body.scrollTop || docEl.scrollTop,
+ left = body.scrollLeft || docEl.scrollLeft;
+
+ this._map._container.focus();
+
+ window.scrollTo(left, top);
+ },
+
+ _onFocus: function () {
+ this._focused = true;
+ this._map.fire('focus');
+ },
+
+ _onBlur: function () {
+ this._focused = false;
+ this._map.fire('blur');
+ },
+
+ _setPanDelta: function (panDelta) {
+ var keys = this._panKeys = {},
+ codes = this.keyCodes,
+ i, len;
+
+ for (i = 0, len = codes.left.length; i < len; i++) {
+ keys[codes.left[i]] = [-1 * panDelta, 0];
+ }
+ for (i = 0, len = codes.right.length; i < len; i++) {
+ keys[codes.right[i]] = [panDelta, 0];
+ }
+ for (i = 0, len = codes.down.length; i < len; i++) {
+ keys[codes.down[i]] = [0, panDelta];
+ }
+ for (i = 0, len = codes.up.length; i < len; i++) {
+ keys[codes.up[i]] = [0, -1 * panDelta];
+ }
+ },
+
+ _setZoomDelta: function (zoomDelta) {
+ var keys = this._zoomKeys = {},
+ codes = this.keyCodes,
+ i, len;
+
+ for (i = 0, len = codes.zoomIn.length; i < len; i++) {
+ keys[codes.zoomIn[i]] = zoomDelta;
+ }
+ for (i = 0, len = codes.zoomOut.length; i < len; i++) {
+ keys[codes.zoomOut[i]] = -zoomDelta;