https://4brewers.ru/public/js/layer/tile/Yandex.js

1// https://tech.yandex.com/maps/doc/jsapi/2.1/quick-start/index-docpage/
2
3/* global ymaps: true */
4
5L.Yandex = L.Layer.extend({
6
7	options: {
8		type: 'yandex#map', // 'map', 'satellite', 'hybrid', 'map~vector' | 'overlay', 'skeleton'
9		mapOptions: { // https://tech.yandex.com/maps/doc/jsapi/2.1/ref/reference/Map-docpage/#Map__param-options
10			// yandexMapDisablePoiInteractivity: true,
11			balloonAutoPan: false,
12			suppressMapOpenBlock: true
13		},
14		overlayOpacity: 0.8,
15		minZoom: 0,
16		maxZoom: 19
17	},
18
19	initialize: function (type, options) {
20		if (typeof type === 'object') {
21			options = type;
22			type = false;
23		}
24		options = L.Util.setOptions(this, options);
25		if (type) { options.type = type; }
26		this._isOverlay = options.type.indexOf('overlay') !== -1 ||
27		                  options.type.indexOf('skeleton') !== -1;
28		this._animatedElements = [];
29	},
30
31	_setStyle: function (el, style) {
32		for (var prop in style) {
33			el.style[prop] = style[prop];
34		}
35	},
36
37	_initContainer: function (parentEl) {
38		var zIndexClass = this._isOverlay ? 'leaflet-overlay-pane' : 'leaflet-tile-pane';
39		var _container = L.DomUtil.create('div', 'leaflet-yandex-container leaflet-pane ' + zIndexClass);
40		var opacity = this.options.opacity || this._isOverlay && this.options.overlayOpacity;
41		if (opacity) {
42			L.DomUtil.setOpacity(_container, opacity);
43		}
44		var auto = { width: '100%', height: '100%' };
45		this._setStyle(parentEl, auto);   // need to set this explicitly,
46		this._setStyle(_container, auto); // otherwise ymaps fails to follow container size changes
47		return _container;
48	},
49
50	onAdd: function (map) {
51		var mapPane = map.getPane('mapPane');
52		if (!this._container) {
53			this._container = this._initContainer(mapPane);
54			map.once('unload', this._destroy, this);
55			this._initApi();
56		}
57		mapPane.appendChild(this._container);
58		if (!this._yandex) { return; }
59		this._setEvents(map);
60		this._update();
61	},
62
63	beforeAdd: function (map) {
64		map._addZoomLimit(this);
65	},
66
67	onRemove: function (map) {
68		map._removeZoomLimit(this);
69	},
70
71	_destroy: function (e) {
72		if (!this._map || this._map === e.target) {
73			if (this._yandex) {
74				this._yandex.destroy();
75				delete this._yandex;
76			}
77			delete this._container;
78		}
79	},
80
81	_setEvents: function (map) {
82		var events = {
83			move: this._update
84		};
85		if (this._zoomAnimated) {
86			events.zoomanim = this._animateZoom;
87			events.zoomend = this._animateZoomEnd;
88		}
89		map.on(events, this);
90		this.once('remove', function () {
91			map.off(events, this);
92			this._container.remove(); // we do not call this until api is initialized (ymaps API expects DOM element)
93		}, this);
94	},
95
96	_update: function () {
97		var map = this._map;
98		var center = map.getCenter();
99		this._yandex.setCenter([center.lat, center.lng], map.getZoom());
100		var offset = L.point(0,0).subtract(L.DomUtil.getPosition(map.getPane('mapPane')));
101		L.DomUtil.setPosition(this._container, offset); // move to visible part of pane
102	},
103
104	_resyncView: function () { // for use in addons
105		if (!this._map) { return; }
106		var ymap = this._yandex;

107		this._map.setView(ymap.getCenter(), ymap.getZoom(), { animate: false });
108	},
109
110	_animateZoom: function (e) {
111		var map = this._map;
112		var viewHalf = map.getSize()._divideBy(2);
113		var topLeft = map.project(e.center, e.zoom)._subtract(viewHalf)._round();
114                var offset = map.project(map.getBounds().getNorthWest(), e.zoom)._subtract(topLeft);
115		var scale = map.getZoomScale(e.zoom);
116		this._animatedElements.length = 0;
117		this._yandex.panes._array.forEach(function (el) {
118			if (el.pane instanceof ymaps.pane.MovablePane) {
119				var element = el.pane.getElement();
120				L.DomUtil.addClass(element, 'leaflet-zoom-animated');
121				L.DomUtil.setTransform(element, offset, scale);
122				this._animatedElements.push(element);
123			}
124		},this);
125	},
126
127	_animateZoomEnd: function () {
128		this._animatedElements.forEach(function (el) {
129			L.DomUtil.setTransform(el, 0, 1);
130		});
131		this._animatedElements.length = 0;
132	},
133
134	_initApi: function () { // to be extended in addons
135		ymaps.ready(this._initMapObject, this);
136	},
137
138	_mapType: function () {
139		var shortType = this.options.type;
140		if (!shortType || shortType.indexOf('#') !== -1) {
141			return shortType;
142		}
143		return 'yandex#' + shortType;
144	},
145
146	_initMapObject: function () {
147		ymaps.mapType.storage.add('yandex#overlay', new ymaps.MapType('overlay', []));
148		ymaps.mapType.storage.add('yandex#skeleton', new ymaps.MapType('skeleton', ['yandex#skeleton']));
149		ymaps.mapType.storage.add('yandex#map~vector', new ymaps.MapType('map~vector', ['yandex#map~vector']));
150		var ymap = new ymaps.Map(this._container, {
151			center: [0, 0], zoom: 0, behaviors: [], controls: [],
152			type: this._mapType()
153		}, this.options.mapOptions);
154
155		if (this._isOverlay) {
156			ymap.container.getElement().style.background = 'transparent';
157		}
158		this._container.remove();
159		this._yandex = ymap;
160		if (this._map) { this.onAdd(this._map); }
161
162		this.fire('load');
163	}
164});
165
166L.yandex = function (type, options) {
167	return new L.Yandex(type, options);
168};