带有Angularjs的Leaflet的白色或空基层答案

【问题标题】：White or empty base layer to Leaflet with Angularjs带有Angularjs的Leaflet的白色或空基层
【发布时间】：2014-07-14 16:35:24
【问题描述】：

我需要创建一个非常简单的地图，我可以在其中向用户绘制简单的对象。

我想通过使用 leaflet-directive 插件在带有 angularjs 的传单中实现它，以便与地图进行交互。这里有一个代码示例：

{
  "baselayers": {
    "osm": {
      "name": "OpenStreetMap",
      "url": "http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png",
      "type": "xyz",
      "layerParams": {},
      "layerOptions": {}
    }
  }
}

想法是创建一个空的或白色的基础层，并在其上添加一个自定义层，但 baselayers 属性不能为空或未定义。

创建空白或白色基础层的最佳方法是什么？

【问题讨论】：

你有没有发现这个问题？
嗨@schaefea 我在下面回答了你。希望对你有用

标签： javascript angularjs map leaflet

【解决方案1】：

我找到了一个解决方案，可能不太聪明，但它确实有效。
我只是使用白色图像作为基础叠加层，然后在其上绘制我需要的所有内容。

baselayers: {
    white: {
        name: 'White',
        type: 'imageOverlay',
        url: 'http://www.ledr.com/colours/white.jpg',
        bounds: [[-540, -960], [540, 960]],
        layerParams: {
            noWrap: true,
            attribution: 'Creative Commons image found <a href="http://www.flickr.com/photos/c32/8025422440/">here</a>'
        }
    }
}

边界是指世界中心的 0, 0 坐标，但这并不重要，因为我的目标是绘制与世界地图无关的对象。

下图是我自己绘制的地图。

【讨论】：

是的，这行得通。我希望有一个不需要使用任何图像来减少服务器命中的解决方案。原来我的范围已经改变，所以我不再需要这样做了，但感谢您发送答案。
如果你不需要平移地图，你可以（如果你需要再做一次）避免使用图像并在没有任何东西的地方设置边界，就像那些在我的例子中。它也有效。
我也在做同样的事情。但是你的图像是一个巨大的 24kb :)。我正在使用一个重量为 68b 的清晰像素。