Популярные вопросы по тегу LEAFLET

Проецирование данных из моего шейп-файла на карту листовок с помощью R

... итку фоновой карты, но не свои 4 данные. Однако я могу видеть свои данные 3 в QGIS. Я получил следующий код и описание 2 от here. library(rgdal) shapeData <- readOGR(".",'myGIS') ogrInfo(".",'myGIS') leaflet() %>% addTiles() %>% setView(lng = -106.363590, lat=31.968483,zoom=11) %>% addPolygons(data=s ...

Использовать svg как карту с помощью leaflet.js

... ть изображение SVG в 4 качестве базовой карты для leaflet.js? В 3 моем случае у меня огромный файл svg, и 2 я хочу, чтобы мои п ...

Как настроить CSS для карты листовок

... чтобы она больше походила на тему 4 по умолчанию для карт Google. Существуют 3 ли разные файлы css ...

Брошюра: Контейнер карты не найден

... { style: function(feature) { return { fillColor: "#FFBB78", fillOpacity: 0.6, stroke: true, color: "black", weight: 2 }; } }).bindPopup(function(layer) { return layer.feature.properties ...

L не определена ошибка с Leaflet

... a</option> <option value="TN">Tennessee</option> <option value="TX">Texas</option> <option value="UT">Utah</option> <option value="VA">Virginia</option> <option value="VT">Vermont</option> <option value="WA">Washington</option> ...

Как сделать переменную высоту карты листовки

... я сделаю 5 height: 100%, это не сработает. Как сделать высоту также 4 переменной, как и ширину, чтобы карту можно 3 было правильно видеть на любом устройстве. Демо: http://jsfiddle.net/CcYp6/ Если 2 вы измените высоту и ширину карты, вы не 1 получите кар ...

Как я могу изменить центр местоположения карты с помощью Leaflet API?

... Options: { maxZoom: 18, zoomControl: false, worldCopyJump: true }, createMap: function() { Map.map = L.map('map', Map.mapOptions); Map.layer = L.mapbox.tileLayer(Map.mapID, { unloadInvisibleTiles: true, }).addTo(Map.map); Map.map.locate({setView: true}); Map.map.addControl(L.mapbox.geocoderControl(Map.mapID)); ...

Очистить слои маркеров (буклет)

... wner=[],notowner=[],hfacilitiesjoin,nothfacilitiesjoin,schemesjoin,notschemesjoin,hfschemes=[],nothfschemes=[]; var healthfac="",ownership=[],availspecialiti=[]; var arrayMap = [];latitude=[];longitude=[]; $.getJSON("../../api/analytics/ ...

Как использовать leaflet.js с react-native

... помощью 8 react. Сейчас моя главная страница отображается 7 следующим образом ... AppRegistry.registerComponent('beacon', () => Home); А мой Home - это просто 6 что-то вроде ... export default Home = () => { return ( <Provider store={store}> <MainMap /> </Provider> ); } Где / Как добавить этот 5 тег скрипта, чтобы включить Leaflet.js? Это вообще 4 возможно? Возможно, есть друг ...

Простая этикетка на листе (геойсон) многоугольнике

... oJSON(g, style_opts); Я 21 бы хотел поместить простую текстовую метку 20 в центр каждого многоугольника. (Например, что-то 19 вроде размещения названия состояния в центре 18 каждого состояния). Я просмотрел: https://groups.google.com/forum/?fromgroups=#!topic/leaflet-js/sA2HnU5W9Fw Что на 17 самом деле перекрывает текст, но когда я 16 добавляю кучу многоугольников, кажется, что 15 метка смещается от центра странным образом, и 14 в ...

Почему мой клиентский компонент в Nuxt жалуется, что окно не определено?

... :zoom="zoom" :center="center" @update:zoom="zoomUpdated" @update:center="centerUpdated" @update:bounds="boundsUpdated" > <l-tile-layer :url="url"></l-tile-layer> </l-map> </div> </template> <script> import { LMap, LTileLayer, LMarker, LFeatureGroup, LGeoJson, LPolyline, LPolygon, LControlScale } from 'vue2-leaflet'; import { Icon } from 'leaf ...

Карта-листовка, загружающая половину серых плиток

... /trunk/html5.js"></script> <![endif]--> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.css" /> <!--[if lte IE 8]> <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4/leaflet.ie.css" /> <![endif]--> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> У меня есть такой 7 ...

Сопоставление Leaflet.draw: как запустить функцию рисования без панели инструментов?

... Я хочу начать рисование 9 многоугольника без использования панели 8 инструментов из leaflet.draw. Мне удалось найти свойство, которое 7 позволяет редактировать без использования 6 панели инструментов (layer.editing.enable();), выполнив поиск в 5 Интернете (его нет в основной документации). Каже ...

React Leaflet: динамическое добавление маркеров

... /{s}.tile.osm.org/{z}/{x}/{y}.png' /> <Marker map={this.refs.map} position={position} > <Popup> <span>A pretty CSS3 popup. <br /> Easily customizable.</span> </Popup> </Marker> </Map> ) } } В addMarker() пытаюсь добавить 5 новый ...

Используете Leaflet с Google Maps?

... то для free, если у меня менее 21 25 000 загруженных просмотров карт в день. Недавно 20 я узнал об удивительной библиотеке JS Leaflet. Я 19 хочу использовать его с OpenStreetMaps. Насколько я понял, не 18 следует использовать плитки, предоставленные 17 OpenStreetMaps (Tile usage policy), а использовать стороннего 16 поставщика, который создает плитки из данных 15 OSM или создает свои собственные. Я не могу 14 предостави ...

Как сохранить Leaflet in R map как файл png или jpg?

... вать карты из скрипта 2 в R. Мой простой код: png("test_png.png") (m <- leaflet() %>% addTiles()) dev.off() Это работает, но ...

Как добавить фломастеры в буклет?

... нужно создать карту с маркерами для 7 каждого из них. Я использую кластеры маркеров 6 и пытаюсь оптимизировать момент добавления. for (var i = 0; i < myItems.length; i++) { var item = myItems[i]; marker = new L.marker([item[2],item[3]], { icon: map ...

Листовка: не запускайте функцию события щелчка при двойном щелчке

... просто хочу увеличить масштаб, не 5 устанавливая маркер. Итак, у меня есть следующий 4 код: var map = L.map(attrs.id, { center: [scope.lat, scope.lng], zoom: 14 }); var marker = L.marker([scope.lat, scope.lng],{draggable: true}); map.on('click', function(event){ m ...

Получите список маркеров / слоев в пределах текущей карты в Leaflet

... для точек, которые 13 находятся на текущей странице результатов 12 поиска. Все это прекрасно работает ... сейчас 11 я бы хотел настроить его так, чтобы, если 10 пользователь масштабирует или панорамирует 9 карту, список результатов поиска обновляется, показывая 8 только маркеры в пределах текущих границ 7 карты. Очевидно, что ...

Сохранение карт Leaflet.js как статического изображения

... ороший method, но я 6 предполагаю, что для этого необходимо, чтобы 5 ваши карты размещались на Mapbox, чтобы 4 у них был идентификатор карты через их API. Кто-нибудь 3 знает, как я могу это сделать с картой Leaflet.js, которую 2 нельзя вызвать через API? ...

Карта-листовка отображается серым цветом

... EY + '/997/256/{z}/{x}/{y}.png', { attribution: 'Map data © [...]', maxZoom: 18 }).addTo(leafletMap); // marker var marker = L.marker([51.5, -0.09]).addTo(leafletMap); style.css: #leafletMap { height: 200px; width: 200px; } index.html: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial ...

Листовка React не отображается должным образом

... вании карты со стандартными 3 компонентами react. На моем сайте также используется 2 react-bootstrap. Насколько я читал, это может вызвать некоторые 1 потенциальные проблемы с отрисовкой react-leaflet. import React from 'react'; import ReactDOM from 'react-dom'; import { Map, Marker, Popup, TileLayer } from 'react-leaflet'; const position = [37.335556, -122.009167]; class MapView extends React.Component { render() { return ( ...

Как загрузить базовый слой Google Maps в Leaflet (после июня 2018 г.)?

... июня 7 2018 года плитки карты Google недоступны 6 без ключа api. В настоящее время к плиткам 5 можно получить доступ через Leaflet JS, используя 4 следующий JavaScript. googleSat = L.tileLayer(' ...

Распечатайте линию / мультилинию на новом слое поверх карты с помощью Folium

... бавлять маркеры и маркеры полигонов. Но 11 насчет печати на новом слое я могу найти 10 только примеры like this one. Мне нужно что-то попроще. Думаю, я 9 мог бы вставить GeoJSON с многострочной 8 информацией аналогичным образом, но я не 7 смог даже найти, какой формат должен быть 6 у GeoJSON. Ест ...

Как связать две координаты линией с помощью Leaflet in R

... о широте и долготе в 5 таблице ниже. | Observation | InitialLat | InitialLong | NewLat | NewLong | |-------------|------------|-------------|-----------|-----------| | A | 62.469722 | 6.187194 | 51.4749 | -0.221619 | | B | 48.0975 | 16.3108 | 51.4882 | -0.302621 | | C | 36.84 | -2.435278 | 50.861822 | -0.083278 | | D | 50.834194 | 4.298361 | 5 ...

Отключить масштабирование колеса прокрутки листовки на миникарте

... p contributors'; var osm = new L.TileLayer(osmUrl, {/*minZoom: 5, maxZoom: 18,*/ attribution: osmAttrib}); map.addLayer(osm); map.setView(new L.LatLng(59.92448055859924, 10.758276373601069),10); //Plugin magic goes here! Note that you cannot use the same ...

Удалить полигон с карты

... при нажатии на новый маркер 1 старый прямоугольник удалялся с карты? //polygon var latBlockSize = 0.002; var lngBlockSize = 0.002; var route = [ new L.LatLng(parseFloat(customer.MailingAddress.Lat) + latBlockSize, parseFloat(customer.MailingAddress.Lng) - lngBlockSize), new L.LatLng(parseFloat(customer.MailingAddress.Lat) + latBlockSize, parseFloat(customer.MailingAddress.Lng) + lngBlockSize), new L.LatLng(par ...

webpack - требуется ('node_modules / leaflet / leaflet.css')

... webpack.config.js выглядит 8 так: 'use strict' var webpack = require('webpack'), path = require('path'), HtmlWebpackPlugin = require('html-webpack-plugin'), srcPath = path.join(__dirname, 'src'); module.exports = { target: "web", cache: true, entry: { app: path.join(srcPath, "index.js&qu ...

Leaflet - хороший инструмент для изображений, не связанных с картой?

... это тривиальная 8 проблема, которую я решил. Однако, глядя 7 на Leaflet API, кажется, что мне пришлось бы преобразовать 6 мои технические иллюстрации (файлы .ai, .svg 5 и .png) в географический стандарт, такой 4 как GeoJSON. Это кажется неудобным предложением. Может 3 ли кто-нибудь порекомендовать Leaflet или 2 любой другой инструмент для навигации по 1 изображениям, не с ...

Масштабирование по размеру всех маркеров в Mapbox или Leaflet

... арте отображались в Mapbox или Leaflet? Как Google Maps 1 API с bounds? Например: var latlngbounds = new google.maps.LatLngBounds(); for ...

Как добавить маркер на карту с помощью обработчика событий листовки map.on ('click', function)

... зова, но 3 не тогда, когда я отделяю функцию от обработчика 2 событий. Обратный вызов (http://fiddle.jshell.net/rhewitt/U6Gaa/7/): map.on('click', function(e){ var marker = new L ...

Изменение цвета значка группы маркеров листовок, наследуя остальные свойства CSS по умолчанию

... iconCreateFunction: function(cluster) { // here there is a piece code that determines the value of the variable 'class_name' is either foo or bar return L.divIcon({ className: "marker-cluster-medium "+class_name}); } }); К 4 сожалению, это решение не работает и приводит 3 к некрасивому отображению значков. Как я 2 могу ...

Как открыть всплывающее окно с маркером листовки по ссылке за пределами карты?

... orm: translate(435px, 200px); z-index: 200;" title="location_1"> При щелчке по маркеру над маркером открывается 8 всплывающее окно. Я пытаюсь добавить ссылки 7 за пределами карты, относящиеся к каждому 6 маркеру. Каждый из маркеров имеет уникальное 5 название. Могу я просто создать список html-ссылок 4 с заг ...

Как добавить пользовательский интерфейс к карте листовок?

... оде пользователем 6 местоположения он перемещался по координатам 5 на карте. Я пробовал создавать элементы и 4 добавлять на карту <div> с вариантами: var d1 = document.getElementsByClassName('leaflet-control-container')[0]; d1.insertAdjacentHTML('afterbegin', '<div id="two">two</div>'); Но <div> отображается 3 позади карты ...

Буклет R с добавлением цветов для символьных переменных

... Var Var Var Data.Type 0 99 2016 743 Type A 1 99 2016 209 Type B 2 99 2016 349 Type A 3 99 2016 349 Type D 4 99 2016 993 Type A 5 99 2016 122 Type E 6 99 2016 194 Type B 7 99 2016 660 Type A 8 99 2016 221 Type C ... Идея состоит в том, чтобы иметь цвет для каждой переменной в Data.Type, которая мо ...

Рисование окружности с радиусом, указанным в метрах на карте

... Я пробовал использовать Leaflet, и 8 его Circle (или CircleMarker) принимает 7 радиус в метрах, но мне нужно больше гибкости, чтобы 6 поиграть с моими данными. D3 кажется довольно ...

Как установить регулятор масштабирования листовки в желаемое положение

... штабированием 6 в разных углах, используя следующий код var map = new L.map("map-container",{ zoomControl: false }); new L.Control.Zoom({ position: 'topleft' }).addTo(map); Таким 5 образом, позиции могут быть topleft topright bottomleft botto ...

Листовка - изменить цвет карты

... om/features.html Если 5 да, то это просто, как с картами Google, или 4 мне нужно как-то раскрасить полигоны, представляющие 3 землю и воду? Я бы хотел воспользоваться 2 информационными окнами листовки, но мне 1 нужно оформить ка ...

Добавьте статические метки к круговым маркерам в буклете

... EachFeature: function(feature, layer) { if (feature.properties && feature.properties.building_name) { var thenumber20 = feature.properties.spacecategoryClassroomsamt; var number30 = thenumber20.toLocaleString('en'); layer.bindPopup({ html: '<b>' + number30 + '</b>' }); layer.bindPopup(feature.properties.building_name + &quot ...

Скрыть / отобразить группы слоев в листовке с собственными кнопками

... вать 13 и скрывать категории маркеров. Это мои маркеры: var aa = L.marker([48.185556, 11.620278]).bindPopup('AA'), bb = L.marker([48.152222, 11.592778]).bindPopup('BB'), cc = L.marker([48.161209, 11.597989]).bindPopup('CC'), dd = L.marker([48 ...

Настройка полноэкранной карты leaflet.js с помощью bootstrap

... величину. Однако я не могу заставить 5 его работать. Это мой файл index.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>NY Noise Map</title> <script src="http://code.jquery.com/jquery-2.1.0.mi ...

Наведение маркера в буклете

... кер на карте листовки вот мой 3 код leaflet.js var map = L.map( 'map', { center: [20.0, 5.0], maxZoom: 16, minZoom: 2, zoom: 2 }) L.tileLayer( 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreet ...

Как добавить надписи поверх многоугольников в листовке

... ящая из многоугольников, и 4 я хотел бы разместить их идентификаторы 3 поверх них. Ниже приведена иллюстрация (с 2 другим программным обеспечением) мое ...

leaflet.js api icons: почему у iconAnchor и popupAnchor разные координаты

... я не нашел этого. Я предпочел бы ЗНАТЬ что-то, а 9 не КАК чего-то добиться. Где в системе координат 8 значка находится точка привязки значка? вверху 7 слева, по центру и т. д.? Является ли точка 6 привязки значка его точкой 0,0? Где в системе 5 координат зна ...

Проверить, виден ли маркер (карта) - mapbox

... 5 и не могу проверить, находится ли он в currentView 4 или нет. Я пробовал код ниже. this.map.getBounds(). contains 3 (e.layer.getLatLng()); но он возвращает 2 мне правду. карта возвращает ...

Преобразование функции стрелки ES6 в ES5

... utton' rel='fancybox-thumb' data-fancybox-group='"+ pointData[i].popup +"' title='" + pointData[i].discrip + " ' href='graphic/"+ pointData[i].popup + "' ><img src='graphic/" + pointData[i].popup + "' alt='Image' ' style='width:150px;' ></a>" + "<br/><a href='http://www.google.com' target='_blank'>Cedellion Report</a>"}`)}) . ...

Почему push показывает аргумент типа 'any []' не может быть назначен параметру типа 'never' error?

... } ).addTo(this.map).bindPopup(data[key].caption); // markers.push(data[key].location.lat,data[key].location.lng); // markers.push(data[key].location); var lat = data[key].location.lat; var lng = data[key].location.lng; markers.push([lat, lng]); } ...

Добавить существующие многоугольники листовок к существующему слою листовок

... бавить 6 их на карту таким образом, чтобы их можно 5 было редактировать с помощью панели инструментов 4 leaflet-draw. Хотя теперь полигоны добавляются на карту, я 3 не ...

Карта экспорта Python ipyleaflet как PNG, JPG или SVG

... имер 6 кода для создания карты from ipyleaflet import * center = [34.6252978589571, -77.34580993652344] zoom = 10 m = Map(default_tiles=TileLayer(opacity=1.0), center=center, zoom=zoom) m Я хочу экспортировать 5 эту карту как файл изображения, не делая 4 снимок экрана вручную. Я нашел два источника, которые 3 позволяют экспортировать карты буклетов 2 javascript: https://github.com/aratcliffe/Leaflet. ...

Как получить строку площади из многоугольника с помощью leaflet.draw

... "click", function (){ createPolygon = new L.Draw.Polygon(map, drawControl.options.polygon); createPolygon.enable(); } var polygon = new L.featureGroup(); map.on('draw:created', function (e) { var type = e.layerType, layer = e.la ...