| 1 | import {ImageOverlay} from './ImageOverlay';
|
| 2 | import * as DomUtil from '../dom/DomUtil';
|
| 3 | import * as Util from '../core/Util';
|
| 4 |
|
| 5 | /*
|
| 6 | * @class SVGOverlay
|
| 7 | * @aka L.SVGOverlay
|
| 8 | * @inherits ImageOverlay
|
| 9 | *
|
| 10 | * Used to load, display and provide DOM access to an SVG file over specific bounds of the map. Extends `ImageOverlay`.
|
| 11 | *
|
| 12 | * An SVG overlay uses the [`<svg>`](https://developer.mozilla.org/docs/Web/SVG/Element/svg) element.
|
| 13 | *
|
| 14 | * @example
|
| 15 | *
|
| 16 | * ```js
|
| 17 | * var element = '<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><image xlink:href="https://mdn.mozillademos.org/files/6457/mdn_logo_only_color.png" height="200" width="200"/></svg>',
|
| 18 | * elementBounds = [ [ 32, -130 ], [ 13, -100 ] ];
|
| 19 | * L.svgOverlay(element, elementBounds).addTo(map);
|
| 20 | * ```
|
| 21 | */
|
| 22 |
|
| 23 | export var SVGOverlay = ImageOverlay.extend({
|
| 24 | _initImage: function () {
|
| 25 | var el = this._image = this._url;
|
| 26 |
|
| 27 | DomUtil.addClass(el, 'leaflet-image-layer');
|
| 28 | if (this._zoomAnimated) { DomUtil.addClass(el, 'leaflet-zoom-animated'); }
|
| 29 |
|
| 30 | el.onselectstart = Util.falseFn;
|
| 31 | el.onmousemove = Util.falseFn;
|
| 32 | }
|
| 33 |
|
| 34 | // @method getElement(): SVGElement
|
| 35 | // Returns the instance of [`SVGElement`](https://developer.mozilla.org/docs/Web/API/SVGElement)
|
| 36 | // used by this overlay.
|
| 37 | });
|
| 38 |
|
| 39 |
|
| 40 | // @factory L.svgOverlay(svg: String|SVGElement, bounds: LatLngBounds, options?: SVGOverlay options)
|
| 41 | // Instantiates an image overlay object given an SVG element and the geographical bounds it is tied to.
|
| 42 | // A viewBox attribute is required on the SVG element to zoom in and out properly.
|
| 43 |
|
| 44 | export function svgOverlay(el, bounds, options) {
|
| 45 | return new SVGOverlay(el, bounds, options);
|
| 46 | }
|