标签: angular-leaflet-directive

我很困惑哪一个使用.我目前正在使用角度映射框 - > http://inkblot.io/angular-mapbox,但是文档没有解释我想要的某些功能,比如如何将API调用中的标记与线连接以及如何将地图置于中心在标记生成时.Angular Mapbox使用$ scope来渲染数据非常棒,但是我想切换到其他东西才能拥有其他功能.有没有人知道一个简单的解决方案,使用带有$ scope的ngrepeat渲染数据,用线条连接这些标记,并在生成这些标记时使地图居中？

是否有所有潜在地图来源的列表？在示例页面上，可以浏览四种类型的地图。外面还有什么？ http://tombatossals.github.io/angular-leaflet-directive/#!/

在阅读了 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 米）是可以的，一个建筑街区之外就不行。

我想改变 leafletjs 中地图的颜色，但我只是不知道它是哪个类。我发现

.leaflet-container {
    background-color:rgba(255,0,0,0.0);
}

然而它只会改变地图外的颜色（当地图完全缩小时你会看到它）但是哪些类负责国家颜色和水？

我正在使用leaflet api，用户可以在其中绘制形状以映射（图像）...

最初使用 imageoverlay 为底图添加图层控件（处理 1 个图层）......

我在页面上添加了一个 id 'newLyer' 的按钮，点击事件处理新图层的创建......即用户可以创建新图层并更新图层控件（现在正在处理 2 个图层）......

我使用了几种方法来创建图层并添加到控件但失败了....

将新图层添加到 layerGroup

var layerGroup = new L.LayerGroup(),
                    imageOverlayUrl = 'aa.jpg',
                    // New imageoverlay added to the layergroup
                    imageOverlay = new L.ImageOverlay(imageOverlayUrl, bounds).addTo(layerGroup),
                    // New featuregroup added to the layergroup
                    featureGroup = new L.FeatureGroup().addTo(layerGroup);

我需要添加控件的 LayerControl（如果我是正确的）

        var layerControl = new L.control.layers({
            'Main': layerGroup,
            //here i need to add new layer control
            }, null, { collapsed: false }).addTo(map);

到目前为止是静态代码的 OnClick 函数，这将在点击时执行

        $('#newLayer').click(function addNewLayer() {
            // Second layergroup not …

我正在AngularJS中构建一个应用程序,它使用LeafletJS与地图进行交互,提供在我称之为阶段的不同可能的交互.对于每个阶段,都有一个UIRouter状态,包括控制器和模板.

我目前正在通过服务提供传单功能.想法是该服务初始化Leaflet地图并提供对该州控制器的一些有限访问.因此,这些控制器将调用服务功能,例如setupMarkersInteractions设置回调,以便在地图上放置标记.

但是,我在通过Leaflet leaflet.map()函数初始化地图时遇到了一个问题,即:Error: Map container not found.这与Leaflet无法找到与地图相关联的HTML元素有关.

目前,我有点这样做:

function mapService() { 
  var map;

  return {
    initializeMap : initializeMap,
    setupMarkersInteractions : setupMarkersInteractions
  };

  function initializeMap() {
    map = leaflet.map('map');
  }

  function setupMarkersInteractions() {
    map.on('click', markerPlacementCallback);
  }
}

该initializeMap函数告诉leaflet.map我查找一个HTML元素id='map',该元素在状态模板上声明.

现在,对于实际问题,这是否与某种AngularJS服务无法访问HTML模板有关？我在这个问题上找不到任何东西,但我认为服务不能直接访问视图
是有意义的...... 如果是,我应该探索什么样的解决方法？我已经研究过leaflet-directive,但它似乎没有提供添加和删除自定义回调的可能性,我希望具有灵活性(例如,当我使用Leaflet-Freedraw添加免费绘制功能时,事情变得复杂).

我考虑leaflet.map直接使用HTMLElement元素的参数,但我仍然无法使它工作 - 虽然我有可能没有传递应该的东西.

我开始使用传单地图,我在js控制台中输出非常嘈杂.它看起来像是在某种调试模式下工作.它有任何选项可以关闭它吗？

在 Leaflet 上，给定中心和半径，我可以轻松创建一个新圆：

// Circle
var radius = 500; // [metres]
var circleLocation = new L.LatLng(centreLat, centreLon);
var circleOptions = {
    color: 'red',
    fillColor: '#f03',
    fillOpacity: 0.5
};
var circle = new L.Circle(circleLocation, radius, circleOptions);
map.addLayer(circle);

上面的圆是创建和绘制的，没有问题，就这样了。

但是，如果我现在想创建并绘制一个包围圆的矩形，则它不起作用。这是我所做的：

// Rectangle
var halfside = radius;   // It was 500 metres as reported above
// convert from latlng to a point (<-- I think the problem is here!)
var centre_point = map.latLngToContainerPoint([newCentreLat, newCentreLon]);
// Compute SouthWest and NorthEast points
var sw_point = …