листовка фиксированный размер круг на карте

Question

Я использую leaflet.js для создания нескольких маркеров и кругов. Я использую ниже данный код, чтобы рисовать круги: -

L.circle([ lat, lng ], 1000, { 
      color : colorCode, 
      stroke : false, 
      fillColor : colorCode, 
      fillOpacity : 0.7 
     }); 

Теперь, если я редактирую этот круг на UI и перетащите этот круг вертикально вниз, то размер увеличивается круг и порок в Versa. Аналогичная проблема связана с вызовом вышеуказанного метода с разными латинскими буквами. Круг с одинаковым радиусом (1000) может быть нанесен на карту с разным размером.

Мое требование - разместить маркер с одинаковым радиусом с одинаковым размером на карте повсюду.

Я проверил L.circleMarker, но он принимает радиус в пикселях, а также circleMarkers не масштабируется в масштабах событий масштабирования. Вот почему я не могу использовать circleMarkers.

Я изменил параметр crs на 4326, но не успел. Я использую imageOverlay not tileset. Я создал скрипку.
http://jsfiddle.net/newBee_/88bdrzkr/12/

Попробуйте создать круг сверху, а затем отредактируйте и переместите его вниз. Это размер увеличивается. Это то, что я хочу остановить. Это решит проблему генерации круга одного радиуса с помощью кода в другой области карты с одинаковым размером. Пожалуйста помоги.

Просьба предложить.

Answer 1

перечёркиванием это дефектное решения, как указывала Ghybs в своем ответе

Очень странно вопрос, оказывается, что перегрузка L.CRS.Simple «s scale метода возврата 256 * Math.pow(2, zoom) исправляет это. Вот вилка вашего JSFiddle: http://jsfiddle.net/kau6g8fk/ Я не уверен относительно причины этой проблемы, это потребует дополнительных исследований. Сделаю, если найду время. Нашли решение здесь: http://codepen.io/mike_beweb/pen/BymKGe

Ответ ниже был приведен до того, как плакат редактировал свой вопрос и показал, что использованный CRS был L.CRS.Simple, в то время как я предположил CRS по умолчанию. Я оставлю это тактично, потому что это может пригодиться для некоторых пользователей:

Изменение размера при перетаскивании вашего L.Circle происходит из-за проекции шаровой проекции по умолчанию вашей карты (EPSG: 3857). Лучший объяснил с изображением, вот карта с координатной сетки наложения на каждые 10 градусов:

Демо на Plunker: Leaflet 0.7.5 EPSG:3857 Spherical

Как двигаться дальше от экватора каждый самолет становится выше. Таким образом, ваш круг автоматически становится выше, чем дальше на север/юг, вы его перетаскиваете. Вы можете использовать эквидистантную проекцию (EPSG: 4326), в которой каждая плоскость имеет такой же размер, независимо от расстояния от экватора:

Демо на Plunker: Leaflet 0.7.5 EPSG:4326 Equirectangular

С equirectangle проекции вы у вас не будет проблемы, с которой вы сейчас сталкиваетесь, но вам придется изменить свой набор плиток на один с EPSG: 4326 проекцией, и их трудно найти по сравнению с наборами EPSG: 3857.

Если вы не хотите или не можете изменить прогноз, другим решением может быть взломать L.CircleMarker и изменить радиус ваших маркеров в зависимости от текущего уровня масштабирования. Но это довольно уродливо, на мой взгляд.

Answer 2

Edit:

Похоже, это bug deep into Leaflet 0.x: радиус вычисления L.Circle использует жестко закодированное проекцию Земли, а не указанных CRS. Листовка 1.0, по-видимому, правильно проверяет CRS перед использованием вычислений, связанных с Землей.

Для вашего случая простое устранение неисправного метода, по-видимому, исправляет его, по крайней мере, визуально.

Демо: http://jsfiddle.net/88bdrzkr/13/

«исправленный» метод, чтобы включить в свой сценарий:

L.Circle.include({ 
    _getLngRadius: function() { 
     return this._getLatRadius(); 
    } 
}); 

Что касается ответа iH8, в трюк, чтобы переопределить L.CRS.Simple.scale похож на высоко масштабирование (256 фактор расширяет LatLng к гораздо большим пикселям - любое большое число будет делать). При большом увеличении вы перемещаете свой круг на очень короткое расстояние, для которого широта не сильно меняется. Таким образом, вы не видите видимой разницы в радиусе, хотя ошибка все еще существует.

Демонстрация использования только более высокого масштаба, ни один метод коррекции на всех: http://jsfiddle.net/kau6g8fk/1/

Для вашей потребности, где круг выглядит больше как визуальной помощи, любой из этих 3-х решений не достаточно.

---

Редактировать: CRS не является проблемой вообще.

Предыдущее сообщение:

Если вы используете листовка для внутреннего отображения, как подсказывает ваша jsFiddle (или любой плоский тип карты, в отличие от проекции сферы, как Земли на плоскости), вы могли бы просто использовать L.CRS.Simple