将Bing Maps磁贴与Leaflet一起使用 [英] Use Bing Maps tiles with Leaflet

问题描述

我正在尝试将Bing Maps磁贴集成到Leaflet中.我发现所有执行此操作的插件都没有帮助，因为它们没有使用情况的信息.我可以用PHP编写脚本以从Leaflet接收X，Y和Z坐标(只需将脚本设置为切片服务器URL)，但是我需要一种将它们转换为Quadkey的方法.任一个答案都是可以接受的.如果有帮助，我确实有Bing Maps API密钥.

I'm trying to integrate Bing Maps tiles into Leaflet. All of the plugins I've found to do this have been no help though since they have no info on their usage. I could write a script in PHP to recieve the X, Y and Z coordinates from Leaflet (just set the script as the tile server URL), but I'd need a way to convert them to a Quadkey. An answer for either would be acceptable. I do have a Bing Maps API key if that helps.

推荐答案

GitHub用户shramov的传单-插件存储库(链接到Nicolas的答案中共享的要点中)包括一个使用Bing磁贴层的示例，据我所知，它已经得到了很好的维护.您需要包含 Bing.js 文件以及 Leaflet JS 和 CSS:

GitHub user shramov's leaflet-plugins repository (linked to in the gist shared in Nicolas' answer) includes an example using a Bing tile layer, and has been fairly well maintained as far as I can tell. You'll need to include the Bing.js file along with the Leaflet JS and CSS:

<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" />
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script>
<script src="Bing.js"></script> 

<div id="map"></div>

<script type='text/javascript'>
    var map = new L.Map('map', {center: new L.LatLng(67.6755, 33.936), zoom: 10 });
    var bing = new L.BingLayer(YOUR_BING_API_KEY);
    map.addLayer(bing);
</script>

您会注意到，必应"图块图层默认为航拍图像".如果打开 Bing.js 文件，则会在

You'll notice that the Bing tile layer defaults to Aerial imagery. If you open the Bing.js file, you'll see on Line 4 that the type property is set to 'Aerial'. This can be changed to 'Road' or 'AerialWithLabels' for the corresponding Tile imagery.

这篇关于将Bing Maps磁贴与Leaflet一起使用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！