Bing Maps进阶系列八:在Bing Maps中集成OpenStreetMap地图

  OSM(OpenStreetMap-开放街道地图)服务就是一种发布自己地图数据图片为服务的一种实现类型,开放街道地图成立动机在于希望能创造并且提供可以被自由地使用的地理资料(像街道地图)给每个想使用的人,就像自由软体所赋予使用者的自由一样,本篇将介绍如何在Bing Maps Silverlight Control开发中去使用OSM发布的地图服务。

  要在Bing Maps Silverlight Control中集成OSM地图是非常简单的,其实无论什么地图都是以地图服务的形式发布出来的,隐藏在其后的都有一套Tile算法,最终在客户端呈现地图则根据具体的Tile映射系统的算法可确定客户端呈现的时候以何种请求的加载出地图数据。实际上要在Bing Maps中集成OSM,也就是通过自定义TileSource来实现,为所需要集成的OSM自定义一个TileSource,专门用于加载此OSM地图数据。关于Bing Maps的TileSystem可查阅我的另一篇博文:《【Silverlight】Bing Maps学习系列(七):使用Bing Maps的图片系统(Tile System)》,里面有对TileSystem的简单应用示例,还有两篇详细介绍Bing Maps的Tile System的博文连接。

  在Bing Maps Silverlight Controls开发中,实现自定义的TileSource有多种方式,可以直接继承Bing Maps Silverlight Controls内置的TileSource实现无范围限制的图层加载,也可以继承于LocationRectTileSource类实现定制范围的地图图层加载,这里以LocationRectTileSource为例演示自定义TileSource加载指定范围的OSM(http://www.openstreetmap.org/)地图数据。


public class OpenStreetMapTileSource : LocationRectTileSource
{
    private const string TilePathMapnik = @"http://{S}.tile.openstreetmap.org/{Z}/{X}/{Y}.png";
    private readonly Random _Rand = new Random();
    private readonly string[] TilePathPrefixes = new[] { "a", "b", "c", "d", "e", "f" };     public OpenStreetMapTileSource()
        : base(TilePathMapnik,
            new LocationRect(new Location(60, 60), new Location(13, 140)),
            new Range<double>(1, 17))
    { }     public override Uri GetUri(int x, int y, int zoomLevel)
    {
        string prefix = TilePathPrefixes[_Rand.Next(6)];
        string url = this.UriFormat;
        url = url.Replace("{S}", prefix);
        url = url.Replace("{Z}", zoomLevel.ToString());
        url = url.Replace("{X}", x.ToString());
        url = url.Replace("{Y}", y.ToString());         return new Uri(url);
    }
}

  如上代码块就是为OSM(http://www.openstreetmap.org/)地图自定义的TileSource,接下来只需要在程序中制定地图的MapTileLayer的源为该TileSource就能实现加载OSM的地图,实现OSM地图与Bing Maps集成了。

<m:Map x:Name="map" Margin="0,0,0,0" CredentialsProvider="{StaticResource MyCredentials}" 
       ScaleVisibility="Visible"
       CopyrightVisibility="Collapsed">
    <m:MapTileLayer x:Name="OSMTileLayer"></m:MapTileLayer>
</m:Map>

  可以通过在XAML中直接给地图(Map)添加一个MapTileLayer,用于加载指定的TileSource的地图,也可以在程序中动态构造MapTileLayer,两种方式实现的效率是一样的。如上代码块是通过直接在XAML代码中加入的MapTileLayer图层,那么可以通过如下方式设置该Tile图层的源,去加载OSM地图。

OSMTileLayer.TileSources.Add(new OpenStreetMapTileSource());

  编译项目运行可以看到成功的将OSM地图集成进了Bing Maps中,详细如下图所示:

        

  需要注意的是OSM也有很多种,在自定义OSM的Tile加载算法得时候得根据所要集成的不同OSM地图进行编写,比如下面的自定义加载OSM地图的TileSource定义:


/// <summary>
/// 自定义OSM地图服务的TileSource
/// </summary>
public class OSMTileSource : LocationRectTileSource
{
    public OSMTileSource()
        : base(@"http://az1923.vo.msecnd.net/osm/{2}/{0}/{1}.png",
            new LocationRect(new Location(-19.047, 47.379), new Location(-18.733, 47.645)),
            new Range<double>(1, 17))
    {
        
    }     /// <summary>
    /// 重写Tile算法
    /// </summary>
    /// <param name="x"></param>
    /// <param name="y"></param>
    /// <param name="zoomLevel"></param>
    /// <returns></returns>
    public override Uri GetUri(int x, int y, int zoomLevel)
    {
        return new Uri(string.Format(this.UriFormat, x, y, zoomLevel), UriKind.RelativeOrAbsolute);
    }
}

  通过和上面集成OSM()地图的TileSource的算法是不同的,加载地图的Tile算法主要取决于发布OSM地图的Tile映射。上面代码块中的定义指定的加载地图图层的范围也不在是中国地区范围了,下图为最终运行效果截图:

        

  最近很多朋友都在问我一个问题,要如何才能发布自己的图片为地图服务,然后加载到地图组件中呈现出来?其实要实现这一功能点是可以的,当然实现这一功能也是痛苦的,首先得了解常用、常见或是一些比较通用的GIS相关的概论和知识体系,了解相关的技术原理和工具的使用后就可以将自己的图片发布为OSM的地图服务,通过本文所介绍的方式就可以加载到Bing Maps中呈现了。

  推荐资源:

  http://www.openstreetmap.org/

  http://msdn.microsoft.com/en-us/library/ee690939(v=MSDN.10).aspx

版权说明

本文属原创文章,欢迎转载且注明文章出处,其版权归作者和博客园共有。

作      者:Beniao                                微软Bing Maps开发群:75662563

文章出处:http://beniao.cnblogs.com/  或  http://www.cnblogs.com/

 
 

Bing Maps进阶系列八:在Bing Maps中集成OpenStreetMap地图的更多相关文章

  1. Bing Maps进阶系列七:Bing Maps功能导航菜单华丽的变身

    Bing Maps进阶系列七:Bing Maps功能导航菜单华丽的变身 Bing Maps Silverlight Control所提供的功能导航是非常强大的,在设计上对扩展的支持非常好,提供了许多用 ...

  2. AngularJS进阶(十九)在AngularJS应用中集成百度地图实现定位功能

    在AngularJS应用中集成百度地图实现定位功能 注:请点击此处进行充电! 前言 根据项目需求,需要实现手机定位功能,考虑到百度业务的强大能力,遂决定使用百度地图第三方服务. 添加第三方模块的步骤与 ...

  3. AngularJS进阶(十八)在AngularJS应用中集成科大讯飞语音输入功能

    在AngularJS应用中集成科大讯飞语音输入功能 注:请点击此处进行充电! 前言 根据项目需求,需要在首页搜索框中添加语音输入功能,考虑到科大讯飞语音业务的强大能力,遂决定使用科大讯飞语音输入第三方 ...

  4. Bing Maps进阶系列九:使用MapCruncher进行地图切片并集成进Bing Maps

    Bing Maps进阶系列九:使用MapCruncher进行地图切片并集成进Bing Maps 在Bing Maps开发中,由于各种应用功能的不同,更多的时候用户可能需要将自己的一部分图片数据作为地图 ...

  5. Bing Maps进阶系列六:使用Silverlight剪切(Clip)特性实现Bing Maps的迷你小地图

    Bing Maps进阶系列六:使用Silverlight剪切(Clip)特性实现Bing Maps的迷你小地图 Bing Maps Silverlight Control虽然为我们提供了简洁.方面的开 ...

  6. Bing Maps进阶系列五:通过DeepEarth的MiniMap控件为Bing Maps扩展迷你小地图

    Bing Maps进阶系列五:通过DeepEarth的MiniMap控件为Bing Maps扩展迷你小地图 Bing Maps Silverlight Control虽然为我们提供了简洁.方便的开发模 ...

  7. Bing Maps进阶系列四:路由功能服务(RouteService)

    Bing Maps进阶系列四:路由功能服务(RouteService) Bing Maps提供的路由功能服务(RouteService)可以实现多方位的计算地图上的路线指示,路径行程等功能,比如说实现 ...

  8. Bing Maps进阶系列三:使用地图图像服务(ImageryService)

    Bing Maps进阶系列三:使用地图图像服务(ImageryService) 地图图像服务(ImageryService)提供了根据地理位置(经度和纬度)坐标和地图的缩放级别解析出对应于地图图片系统 ...

  9. Bing Maps进阶系列二:使用GeocodeService进行地理位置检索

    Bing Maps进阶系列二:使用GeocodeService进行地理位置检索 在<Bing Maps进阶系列一:初识Bing Maps地图服务>里已经对GeocodeService的功能 ...

随机推荐

  1. DropDownList 递归绑定分子公司信息

    /// <summary> /// 绑定下拉框 /// </summary> /// <param name="ddl">绑定控件名称</ ...

  2. 【原】Mysql存储关联数组

    $fruits= array("apple" => "苹果", "banana" => "香蕉"," ...

  3. 【 jquery 】常用

    $("#input1").show('slide');    渐进显示$("#input1").hide('slide');     渐进隐藏 siblings ...

  4. 【反向并查集、联通图】P1197 [JSOI2008]星球大战

    题目描述 很久以前,在一个遥远的星系,一个黑暗的帝国靠着它的超级武器统治着整个星系. 某一天,凭着一个偶然的机遇,一支反抗军摧毁了帝国的超级武器,并攻下了星系中几乎所有的星球.这些星球通过特殊的以太隧 ...

  5. Luogu P4549 裴蜀定理 / Min

    思路 题目已经给出了正解.我们只需要将裴蜀定理推广到若干数的线性组合就可以做这道题了 要注意的是需要在输入的时候取一个绝对值.因为可能会有负数存在.我之前也写过裴蜀定理的证明,要看的话点这里 吐槽 第 ...

  6. trie字典树模板浅析

    什么是trie? 百度百科 又称单词查找树,Trie树,是一种树形结构,是一种哈希树的变种.典型应用是用于统计,排序和保存大量的字符串(但不仅限于字符串),所以经常被搜索引擎系统用于文本词频统计.它的 ...

  7. 3. Python中的分支判断、循环

    本文利用的是Python 3.x版本,建议学习3.x版本 Python中的分支判断.循环 1. 分支条件判断 1.1 比较操作 以下是数之间常见的比较操作,例如5>3就是数学意义上的比较,5是大 ...

  8. pandas处理各类表格数据

    经常遇到Python读取excel和csv还有其他各种文件的内容.json还有web端的读取还是比较简单,但是excel和csv的读写是很麻烦.这里记录了pandas库提供的方法来实现文本内容和Dat ...

  9. spring boot & JsonParser

    spring boot https://stackoverflow.com/questions/29313687/trying-to-use-spring-boot-rest-to-read-json ...

  10. POJ2528 Uva10587 Mayor's posters

    The citizens of Bytetown, AB, could not stand that the candidates in the mayoral election campaign h ...