Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 27.11.2018, 09:27
Профессор
Отправить личное сообщение для Роман Андреевич Посмотреть профиль Найти все сообщения от Роман Андреевич
 
Регистрация: 12.08.2016
Сообщений: 299

карты. leaflet. es6. Видимо потеря контекста
Коллеги, доброго времени суток, прошу помощи. В продолжении вчерашнего вопроса, встала очередная проблема. Разбираю код бывшего коллеги. Карта, выводим слой подложки google maps на него накладываем другой слой:

import rosreestrLayerOptions from './layerOptions.js';

export default class Map {

	constructor() {

		this.eventEmitter = eventEmitter.bus;

                layerOptions.init()

		this.conteiner = document.getElementById("map"),
		this.map = false;
		this.overlays = {

			google: L.tileLayer('http://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}', {
		    
				maxZoom: 20,
				subdomains:['mt0','mt1','mt2','mt3'],
				disableDefaultUI: true,
				styles: [{
					featureType: "poi",
					stylers: [{ visibility: "off" }]
				}]

			}),
			newGrid: new L.TileLayer.newLayer("/api/grid?x={x}&y={y}&z={z}&dpi=96&transparent=true&format=png32&bbox={bbox}&size=256,256&bboxSR=102100&imageSR=102100&f=image", {
                
                tileSize: 256,
                clickable: true,    
                zIndex: 103

            })

		};
		this.options = {

		    attributionControl: false,
		    zoomControl: false,
		    doubleClickZoom: false,
		    inertia: true,
		    zoom: 15,
		    maxZoom: 17,
		    minZoom: 6

		};
		this.currentMapData = {

			lat: 0,
			lng: 0,
			center: []

		};

	}

	init(lat, lng) {

		this.map = L.map(this.conteiner, this.options);

		this.map.setView([lat, lng]);

		this.map.addLayer(this.overlays.google);

		this.map.addLayer(this.overlays.rosreestrGrid);

		this.listener();

	}

	}

}


суть я думаю ясна, инициализирую карту, накладываю слой. Тут:

'use strict';

export default class layerOptions {

	static init(layer) {

		L.TileLayer.newLayer = L.TileLayer.extend({
            options: {
                tileSize: 256
            },
            getTileUrl: (tilePoint) => {
                let map = this._map,
                    crs = map.options.crs,
                    tileSize = this.options.tileSize,
                    nwPoint = tilePoint.multiplyBy(tileSize),
                    sePoint = nwPoint.add([tileSize, tileSize]);
         
                let nw = crs.project(map.unproject(nwPoint, tilePoint.z)),
                    se = crs.project(map.unproject(sePoint, tilePoint.z)),
                    bbox = [nw.x, se.y, se.x, nw.y].join(',');

                return L.Util.template(this._url, L.extend({
                    s: this._getSubdomain(tilePoint),
                    z: tilePoint.z,
                    x: tilePoint.x,
                    y: tilePoint.y,
                    bbox: bbox
                }, this.options));
            },
            onAdd: (map) => {

                L.TileLayer.prototype.onAdd.call(this, map);

                if (this.options.clickable) {
                
                    L.DomUtil.addClass(this._container, 'leaflet-clickable-raster-layer');
                
                    if (this._needInitInteraction) {
                
                        this._initInteraction();
                        this._needInitInteraction = false;
                
                    }

                }
            },
            _needInitInteraction: true,
            _initInteraction: () => {
                let div = this._container,
                    events = ['dblclick', 'click', 'mousedown', 'mouseover', 'mouseout', 'contextmenu'];

                for (let i = 0; i < events.length; i++) {

                    L.DomEvent.on(div, events[i], this._fireMouseEvent, this);

                }
            },
            _fireMouseEvent: (e) => {
                let map = this._map;
                if (map.dragging && map.dragging.moved()) { return; }

                let containerPoint = map.mouseEventToContainerPoint(e),
                    layerPoint = map.containerPointToLayerPoint(containerPoint),
                    latlng = map.layerPointToLatLng(layerPoint);

                this.fire(e.type, {
                    latlng: latlng,
                    layerPoint: layerPoint,
                    containerPoint: containerPoint,
                    originalEvent: e
                });
            }
        });

	}

}


как я понимаю происходит установка опций, но и контекст теряется.

leaflet подключаю в шаблоне
<script src="/javascripts/libs/leaflet/leaflet-src.js"></script>
.

Кто нибудь работал с leaflet и es6???? Как решить проблему. Заранее благодарю.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Карты. leaflet. ES6 кто работал???? Роман Андреевич Элементы интерфейса 5 26.11.2018 17:58