标签: leaflet

我已经相当深入地阅读了传单文档，但找不到我的问题的简单答案。

首先是一些上下文：

我创建了一个新地图并将其居中在当前位置，并为找到的位置添加了一个侦听器。

    var map = L.map('map', {zoomControl: false}).fitWorld();

    L.tileLayer('https://api.mapbox.com/styles/v1/mapbox/outdoors-v9/tiles/256/{z}/{x}/{y}?access_token=pk.eyJ1IjoiZG9ucZhc3o3ODMifQ.3-x6nnTgePEK0ERPllV7oQ', {
        maxZoom: 20
    }).addTo(map);

    map.locate({setView: true, watch: true, maxZoom: 17});
    map.on('locationfound', onLocationFound);

我现在想在当前位置创建一个标记，例如

    marker = L.marker(map.getLatLong);
    marker.addTo(map);

这将通过 onLocationFound() 函数完成，因为我只想创建它一次，然后使用 locationfound 事件让标记移动使用 marker.setLatLng()。

我怎样才能使用传单来获取当前的 LatLong？它是否有 HTML5 Geolocation API 的简单替代方案？

我试过 map.getCenter 但它返回 (0,0)

我正在制作传单地图和标记。

我从 JSON 获取标记 latlng 并正确显示。

getLatLng()

function getLatLng() {
  var details = '/equipment/api/getLatLong';
  $.ajax({
    url: details,
    method: 'get'
  }).done(function(response) {

    $('.subSection').html('').append('<section><button type="button" onclick="hideEquipmentDetails()"><i class="fa fa-times"></i></button></section>');
    var equipmentDetails = response.data.filters;
    console.log(equipmentDetails)
    $.each(equipmentDetails, function(i, value) {
      L.marker([value.latitude, value.longitude]).addTo(map).bindPopup('<b><span> Name:</span>' + value.name + '</b>');
    })
  });
}

setInterval(function() {
  getLatLng();
}, 5000)

我每 5 秒刷新一次方法。

所以我需要在更新的 latlng 中显示标记，并且应该隐藏旧标记。

setInterval(function() {
  //L.marker.setOpacity(0);
  //L.markerClusterGroup()
  //markers.clearLayers();
  //map.removeLayer(L.marker);
  //markers.removeLayer()
  //L.marker().removeTo(map);
  getLatLng();
}, 5000)

我尝试了所有选项来实现这一目标，但我做不到。

有没有其他方法可以做到？

否则我应该再定义一个数组来存储初始 latlng 值，然后每次检查 latlng 是否更改（在这种情况下，我只能替换更新的 latlng 标记，对吗？不需要每次都替换所有标记，对吗？）

在阅读了 Projection 的文档和一些尝试失败的测试后，我发现自己无法找到解决此问题的方法。

我发现的所有解决方案都与 x 和 y 坐标参考墨卡托地图投影这一事实有关，但在这种情况下，我将它们来自放置在地图图层上的本地图像。

假设我有一个 400px * 200px 的灰色图像，使用 ImageOverlay.Rotated 放置在传单地图上，位置如下：

var topleft = L.latLng(41.604766, 0.606402);
var topRight = L.latLng(41.605107, 0.606858);
var bottomleft = L.latLng(41.604610, 0.606613);

此图像使用左上角、右上角和左下角坐标作为参考放置在地图上。

结果是一个稍微向北旋转的矩形。

如果我知道我将手机留在像素 100,50（原始图像的左角）处，我如何将这个笛卡尔坐标转换为我的地图的纬度和经度以显示它？

如果它是一个与北方完美对齐的矩形，我想我可以得到左上角和左下角之间的 º 差异，将其除以像素数，然后将结果与手机的 Y 相乘以获得纬度。使用先验值，我将它乘以我手机的 X 以获得我手机的经度。

但鉴于形状是旋转的，世界并不平坦，而且我在地理和三角学方面非常糟糕，我不确定它是否足够精确。

最后，我们说的是电话，而不是建筑物。几米外（2-4 米）是可以的，一个建筑街区之外就不行。

我也需要创建L.Control子类L.Evented。 include: [ L.Mixin.Events ]工作，但显示警告，它已被弃用，我需要从L.Evented. 但我不能因为我需要继承L.Control. 我想怎么办？

当有多个这样的图层控件时，如何更改网页中传单图层控件图标的图标？

目标是在这里有不同的图标：

代码如下：

var layers1 = L.control.layers(...).addTo(map);
var layers2 = L.control.layers(...).addTo(map);

如果我通过 CSS 更改控件的图标，它会在所有图层控件中更改。

我在传单中使用了一个测量插件工具，但是当我尝试在标记之间进行测量时，弹出窗口会干扰有没有办法解决这个问题？我读了一些关于oddclicks的内容，我尝试使用它但无济于事。

$(".leaflet-control-measure").click(function() {
  var oddClick = $(this).data("oddClick");
 $(this).data("oddClick", !oddClick);
 if (!oddClick) {
   map.off('click', popup);
 } else {
    map.on('click', popup);
 }
 });

   popup logic- I am reading from a database, the popup is called from python in a for loop, and rendered using the jinja2 template
 var markers= L.markerClusterGroup({
      disableClusteringAtZoom: 15,
      minZoom : 2

  });


  {% for item in markers %}


   var resortIcon = L.icon({
       iconUrl: '{{ item[3] }}',
      iconSize: [25, 25],
      popupAnchor: [0,-15]
    });

   var marker{{ item[0] }} = L.marker({{ …

我正在尝试将 layer.GetLatLngs 转换为只有数字的数组，

[[17.68397, 1.98629],[17.6777, 1.96555],[17.66679, 1.9648],[17.6611, 1.99233]]

问题是输出是沿着的

LatLng(17.50438, 1.04772),LatLng(17.48686, 1.05775)

将数字仅转换为数组的最佳方法是什么？

//代码片段

map.on('draw:created', function (e) {

var type = e.layerType,
    layer = e.layer;
if (type === 'polygon') {
    layer.on('click', function() {
        window.alert(polys);    
    });
}

drawnItems.addLayer(layer);
polys = layer.getLatLngs();
});

我正在创建一个使用传单地图的应用程序。我想知道是否有任何外部库可以用来将坐标转换为街道地址？我使用 Angular 6。

我正在尝试使用 Leaflet 创建地图并在地图上显示标记。有没有人对我在地图上显示标记时收到的以下错误有任何想法？

我可以启动页面的地图加载：

var map;
var ajaxRequest;
var plotlist;
var plotlayers=[];

function initmap() {
    // set up the map
    map = new L.Map('map');

    // create the tile layer with correct attribution
    var osmUrl='https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';
    var osmAttrib='Map data © <a href="https://openstreetmap.org">OpenStreetMap</a> contributors';
    var osm = new L.TileLayer(osmUrl, {minZoom: 8, maxZoom: 20, attribution: osmAttrib});       

    // start the map over Holland
    map.setView(new L.LatLng(52.36994, 4.90788),8);
    map.addLayer(osm);
}

我创建了一个标记：

var marker=L.marker([52.63275, 4.75175]).bindPopup('testmarker');

将标记添加到地图时，出现错误“Uncaught TypeError: Cannot read property 'addLayer' of undefined”：

marker.addTo(map);

当在 initmap() 函数中包含这一行时，它工作正常。所以看起来地图实例是不可访问的还是函数之外的东西？哪个很奇怪，因为变量是在脚本开始时在函数之外创建的？

谢谢！

嗨，我正在尝试使用传单添加自定义标记并使用 Routing.control 绘制路线。我需要向标记添加一个变量，因为我需要不时更新标记位置之一。我只会有 3 个标记或航点，一个起点，一个第二个和第三个。我可能只需要移动开始标记。

添加绘制路线并添加默认标记的路线的代码是

var route = L.Routing.control({
     waypoints: [
    L.latLng(my_lat, my_lng),
    L.latLng(job_p_lat, job_p_lng),
    L.latLng(job_d_lat, job_d_lng)
 ],show: false, units: 'imperial',
 router: L.Routing.mapbox('API KEY HERE')
}).addTo(map);

我已经尝试了一些不值得展示的东西，完全没有。任何建议都会很棒，谢谢