显示瓦片地图

需求场景:给出瓦片地图各个层级的比例尺,窗口显示地图的需要Tile的行列号,及各自的顶点坐标。

需要理解的GIS概念:

比例尺(Scale)

地图上的一厘米代表着实际上的多少厘米。比如 1:1,155,583.42  意思是地图上1cm 等于实际11.5558342km。

DPI

屏幕每英寸含有的像素点,一般屏幕是取96

1英寸 = 2.54 CM

1像素 = 0.0254/96 M  (地图上) 真实距离还要乘以 Scale

地图分别率(Resolution)

1个像素 对应多少个地理单位,这里地理单位依赖于切割地图的坐标系,一般就是经纬度

如果地理坐标系是wgs84,地图的单位是度,dpi为96

比例尺与分辨率之间的换算公式

Resolution = 1个像素对应的真实米 / 1度对应的真实米

1个像素真实米 = 0.0254/96 * Scale

1度对应真实米 = 2 * Math.PI * 6378137 / 360  约等 111194.872221777米

地图切图的原点是经纬度(-180,90),地图的瓦片大小是tileSize,给定要显示的中心点经纬度(lonX,latY),

计算出需要在WScreen和HScreen的窗口中显示的tile范围及定点坐标。

        double tileSize = PGIS_TILE_WIDTH * pResolution;  //瓦片地理长度
        double windowW = WScreen * pResolution;       //窗口地理长度
        double windowH = HScreen * pResolution;
//窗口左上角地理偏移量
        double windowOffsetW = WScreen/2 * pResolution;
        double windowOffsetH = HScreen/2 * pResolution;
    //左上角 的地理坐标 (这样计算是假设窗口的中心点与显示的地图中心点重合)
        double leftW  = cenlon - windowOffsetW; //经度 向左 越小
        double leftH = (cenlat + windowOffsetH);  // 向上 是纬度越大 所以是加
    //step1:第一张瓦片的行列号,
        pFirstW = floor((leftW-maporiX)/tileSize);//向右经度变大,所以是终点经度减
        pFirstH = floor((maporiY-leftH)/tileSize); //向下纬度变小,所以是起点纬度减
    //窗口范围内可以显示tile的张数
        Wcount = ceil(windowW/tileSize) + 1;
        Hcount = ceil(windowH/tileSize) + 1;
    //step2:最后一张tile的 行列号
        pEndH = pFirstH + Hcount - 1;
        pEndW = pFirstW + Wcount - 1 ;
      //窗口左上角像素坐标(这里是以地图切割原点是0,0)
        double pixX = (leftW-maporiX)/pResolution;
        double pixY = (maporiY - leftH)/pResolution;
    //step3:第一张tile左上角照片 偏移量(窗口左上角的像素坐标是0,0)
        leftxTopDiffToCtrl = pixX  - pFirstW * PGIS_TILE_WIDTH;
        leftyTopDiffToCtrl =  pixY  - pFirstH * PGIS_TILE_HEIGHT;

  至此,我们可以计算出,每一张tile在窗口坐标系下的像素坐标点,完成地图的显示。用户平移地图的操作,就是改变地图中心点经纬度坐标,重新计算要显示的瓦片的行列号,及第一张瓦片左上角相对于窗口的像素坐标值。

参考链接:

http://www.thinkgis.cn/topic/541a5206da8db186fd0673ba

时间: 2024-10-04 00:56:32

显示瓦片地图的相关文章

Cocos2d-x使用瓦片地图

图所示的复杂地图可以使用瓦片地图技术,瓦片地图是用一些小图片(瓦片)拼接而成,这样可以大大地减少内存消耗.如图所示的瓦片地图,只需要如图所示的三个瓦片就可以了. 瓦片地图 地图中的瓦片 瓦片地图的分类瓦片地图可以有三种分类:直角地图.斜角地图和六边形地图.1.直角地图直角地图,如图所示是使用方形瓦片构建,看上去是垂直向下观察的鸟瞰图,构成瓦片地图的瓦片不一定是正方形,也可以是长方形瓦片. 2.斜角地图斜角地图,如图所示是使用菱形瓦片构建.斜角地图是将视角旋转到45度,斜角地图能够使我们的大脑错误

瓦片地图技术总结

两个月以来,开始涉入WebGIS这块领域,发现GIS的东西确实挺多,每个方向需要研究的东西也很多,现把瓦片地图这一块的内容进行下总结.本文主要是对这个技术进行一个总体的介绍,目前,从事的是瓦片地图客户端方面的开发,后续会对其技术的具体实现做一个详细的介绍. 瓦片地图的定义 瓦片地图现状 瓦片地图设计涉及方向 瓦片地图定义: 瓦片地图:其实就是WebGIS中的一部分吧,我暂时这么理解,而且,应该是属于WebGIS中比较重要的一块.顾名思义,瓦片地图就是由一块块固定大小的“小图片”地图拼接而成的网络

关于Cocos2d-x的瓦片地图

1.cocos2d-x的瓦片地图是用Tiled地图编辑器做的,这个软件开源,免费,一般都是用它制作瓦片地图. 2.瓦片地图是由块层和对象组成的,块层的作用是显示和一些重叠的时候覆盖角色的作用,而对象是可以进行一些事件的触发和处理的.可以从制作好的plist文件中获取主角对象的坐标,这个坐标可以作为精灵创建时的初始坐标. 3.第一层块层可以是背景层,第二层块层可以是事物层,然后再加一个主角对象,打包成plist文件就可以了. 4.地图随主角的移动,其实是屏幕的移动,瓦片地图本身没有动,主角在动,动

瓦片地图的前世今生(转载)

从古巴比伦黏土地图到今天的电子地图,从哥伦布航海图到现代化的卫星导航,地图的历史凝聚着人类的好奇和智慧,也掺杂着血腥和欲望.地图的历史足够厚重,因为地图关联着政治.军事.经济的沉浮:地图的历史也足够精彩,因为地图是为满足需求,伴随科学和技术的发展而发展起来的.      相当长一段时间内,地图都是小部分人的游戏.军事家用地图指挥战役:航海家用地图指引方向:国家用地图标记领地... 直到计算机技术普及,地图技术开始服务于更多的领域. 但始终是,专业的人,在专业领域,做着与地图有关的专业的事. 直到

Google Map API V3调用arcgis发布的瓦片地图服务

由于最近项目需要用到CAD制作的地图,但之前一直使用的是用谷歌离线瓦片地图的方式,怎么样把CAD图像地图一样有缩放,移动的功能放到网页显示成了难题, 原先的谷歌地图的代码难道就不能用了?重新写一套代码得多久呢,得花多少时间精力呢? 于是开始尝试了N种方法,最后找的可能算是最好的方法可以沿用现有的代码,方法是:首先要用ARCGIS软件,把CAD图转化为mxd文件(当然其中各种困难就不提了,而且转换后的效果不一定能和CAD完全一样), 最后请教的是学地理信息系统专业的朋友才搞定的.其次把mxd发布成

cocos2dx[3.4](25)——瓦片地图TiledMap

[唠叨] 还记得我们小时候玩的小霸王里面的游戏吗?大部分都是基于Tile地图的游戏,如坦克大战.冒险岛.魂斗罗.吞食天地等.而在手游中,基于瓦片地图的游戏也很常见.如:<保卫萝卜>. 瓦片地图有专门的地图编辑器:Tiled Map Editor . 先给大家看个酷炫的图吧. 此图来自:http://blog.csdn.net/aa4790139/article/details/8135831 [参考] http://cn.cocos2d-x.org/tutorial/lists?id=70 

android瓦片地图技术研究

最近根据公司项目需求,需要制作场馆的室内图并且实现根据rfid信号的自动定位功能,研究了好久找到了一个目前为止还算好用的瓦片地图工具——TileView. github连接:https://github.com/moagrius/TileView Gradle: compile 'com.qozix:tileview:2.0.1' 这个控件的功能非常强大,你可以根据需求制作任意尺寸大小的地图,可以添加marker标记,绘制路线,定位等等,如果你需要展示超大图片,或制作自定义地图应用这是你的不二选

Leaflet 调用百度瓦片地图服务

在使用 leaflet 调用第三方瓦片地图服务的项目,主要谷歌地图.高德地图.百度地图和 OSM 地图,与其他三种地图对比,百度地图的瓦片组织方式是不同的.百度从中心点经纬度(0,0)度开始计算瓦片,而谷歌地图是从左上角经纬度(-180,90)度开始计算瓦片:如果直接使用百度瓦片地图服务会请求不到瓦片,因此需要转换一下.借助 leaflet-tileLayer-baidu 这个插件: //需要引入 proj4.js 和 proj4leaflet.js 插件,使用script标签引入的方式 L.C

百度地图的使用之获取数据库表中信息的坐标点显示在地图上

//通用封装好的js: var map = new BMap.Map("container"); //建树Map实例 var point = new BMap.Point(103.976032, 33.845509); // 建树点坐标 map.centerAndZoom(point, 6); // 初始化地图,设置中心点坐标和地图级别. //地图事件设置函数: map.enableDragging(); //启用地图拖拽事件,默认启用(可不写) map.enableScrollWhe