(十二) WebGIS中矢量图层的设计
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/。
1.前言
在前几章中我们已经了解了什么是矢量查询、屏幕坐标与地理坐标之前的转换以及要素的设计,有了这些知识,这一章里我们终于可以进行矢量图层的设计了。
在Catalog里创建一个FeatureClass时,我们能够选择是创建点图层或者线图层或者面图层等。所谓点图层,即该图层中的要素只能是点,其他几个图层顾名思义,也是如此。那么在WebGIS中,我们同样也可以按照ArcGIS里的这个设计思路来设计我们的矢量图层,虽然这个方法是肯定可行的,但是在实际的业务需求中,如果按照这种点图层等来严格控制的话,代码的灵活性以及简约性会大大的降低。那么到底我们该如何设计我们的矢量图层方能达到最好的效果呢?下面我们来一起谈谈。
2.提出几个需求
(1).有一段公路需要在地图上显示出来,并且公路上的每个节点也要明显的标注出来。
(2).需要显示出一个消防中队所在的位置,并且将其以服务半径作为缓冲得出的缓冲显示出来。
(3).希望显示出各个关注的人员在地图上的位置,并且鼠标移到人员图标上后,能够有气泡弹出,展示该人员的目前相关信息。
3. 分析需求
如果我们按照ArcGIS中点、线、面图层的思路来设计的话,第一个需求里,我们就需要设计出两个图层来,一个线图层,一个面图层。同样对第二个需求,我们也需要专门制作出一个点图层和一个面图层来。
现在,我们能否换一个思路来想呢,我们能否将点图层、线图层、面图层融合成一个业务图层呢?比如第一个需求,其实就只要线要素和点要素添加到同一个Canvas下即可了,一张以业务来划分的矢量图层就产生了。
同样,第二个问题的解决思路就是将点要素和面要素(圆要素)整合在一起便可。而第三个问题的解决思路就更简单了,只需要添加点(图标)要素即可。在要素的设计中我们已经详解了每个要素都是继承UIComponent的,都能监听鼠标事件,所以弹出气泡的需求也便自然而然的可以实现了。
4.设计图

5.设计流程图

6.由一个案例进行详解
这里,我们以之前提出的需求中的第一个道路显示问题来进行详解。
第一步,客户端列出请求参数,比如需要显示的道路的ID号等,然后向矢量服务发送请求。如果是最短路径分析,可以把起始点和终点作为参数,向后台的NA服务发送请求。
第二步,解析服务器返回的数据。得出数据中的各个要素的Geometry和Attribute。然后根据Geometry中的geometryType进行对应的要素的实例化,将Geometry和Attribute作为该实例化要素的属性。在此需求中,首先需要根据返回的线要素数据实例化相同个数的线要素。同时根据线要素的Geometry中的端点信息,实例化出点要素。
第三步,将所有实例化出的点要素和线要素添加到道路图层(Canvas)中,并触发每个要素的绘画函数。由于每个要素均有重绘以及坐标转换的内部实现,所以我们不需要在Canvas中再实现相同功能。
不过,这里我需要说明一个问题,在我们的自制图层中,我们还是需要监听地图事件来进行一些必须的操作的。而这个操作是跟地图平移有关系。否则在地图进行拖动后,该图层上的要素进行重绘时,会发生偏移问题。和上节提到的一样,地图中要素偏移问题我会在以后专门花一节跟大家来探讨。
7.总结
至此,在这个系列中,对栅格图层和矢量图层的设计以及所涉及到的内容我均已讲完了。对于地图的显示和一些基本的业务定制功能实现,我想大家应该都有一些思路了。在接下来的一个系列里,我想和大家一起探讨地图工具栏中基本功能的设计实现,比如放大、缩小、平移、全图、I查询、兴趣点查询、定位等。希望大家持续关注。祝大家节日快乐。
----欢迎转载,但保留版权,请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/
活着便是为了受苦,为了历练,为了明白到底我们需要的是什么。
(十二) WebGIS中矢量图层的设计的更多相关文章
- (八)WebGIS中栅格图层的设计
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1. 前言 我们在上一章里了解到WebGIS中栅格图层的本质—— ...
- (十五)WebGIS中平移功能的设计和实现
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 这一章我们将详细讲解WebGIS工具栏中另一个基础工具——平 ...
- (十四)WebGIS中地图放大缩小的设计和实现
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 在上一章中,我们给出了整个工具栏设计的核心,使用命令模式,并 ...
- (十六)WebGIS中偏移补偿量引发的问题之探讨
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 在上一章里讲解地图平移功能的实现时,我在最后提出了两个问题: ...
- (十)WebGIS中地理坐标与屏幕坐标间的转换原理
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.前言 地图本身是拥有坐标的,一般可以大致分为平面坐标和经纬度坐标, ...
- 三十二、Java图形化界面设计——布局管理器之CardLayout(卡片布局)
摘自 http://blog.csdn.net/liujun13579/article/details/7773945 三十二.Java图形化界面设计--布局管理器之CardLayout(卡片布局) ...
- OpenJDK源码研究笔记(十二):JDBC中的元数据,数据库元数据(DatabaseMetaData),参数元数据(ParameterMetaData),结果集元数据(ResultSetMetaDa
元数据最本质.最抽象的定义为:data about data (关于数据的数据).它是一种广泛存在的现象,在许多领域有其具体的定义和应用. JDBC中的元数据,有数据库元数据(DatabaseMeta ...
- (转)SpringMVC学习(十二)——SpringMVC中的拦截器
http://blog.csdn.net/yerenyuan_pku/article/details/72567761 SpringMVC的处理器拦截器类似于Servlet开发中的过滤器Filter, ...
- (十八)WebGIS中清空功能和地图定位功能的设计以及实现
文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 当地图中增加了很多元素后,对不同的元素需要进行一定的控制,最 ...
随机推荐
- mailto
什么是mailto链接? mailto链接是一种html链接,能够设置你电脑中邮件的默认发送信息.但是需要你电脑中安装默认的E-mail软件,类似Microsoft Outlook等等.加入您已经安装 ...
- ANT_HOME is set incorrectly or ant could not be located .Please set ANT_HOME.
今天配置ant,奶奶的老是报错. 因为环境变量 ANT_HOME 和 JAVA_HOME 设置值不能有“;” ,把分号去掉即可成功了. 神奇!
- CSS外边距叠加问题
CSS外边距叠加就是margin-collapse,边距合并指的是,当两个垂直外边距相遇时,它们将形成一个外边距,水平边 距永远不会重合.重叠结果计算规则:①.两个相邻的外边距都是正数时,折叠结果是它 ...
- 在Excel中把横行与竖列进行置换、打勾号
在Excel中把横行与竖列进行置换:复制要置换的单元,在新的单元上右键->选择性复制,会出现对话框,选中“置换”,即可在Excel中打勾号,左手按住ALT不放,右手在小键盘也就是右边的数字键盘依 ...
- 把token带到 http头部 或者验证一下referer
提交地址:http://baozoumanhua.com/users/8311358提交数据:-----------------------------195704664324Content-Disp ...
- datatables服务器端分页要点
背景:当要查询大量数据的时候,有datatables自身的分页,明显查询比较慢,这是要使用服务器端分页 参数:"bServerSide": true, "fnServer ...
- MySQL 数据库主从复制架构
前文<MySQL 数据库事务与复制>分析了 MySQL 复制过程中如何保证 binlog 和事务数据之间的一致性,本文进一步分析引入从库后需要保证主从的数据一致性需要考虑哪些方面. 原生复 ...
- 解读ASP.NET 5 & MVC6系列(3):项目发布与部署
本章我们将讲解ASP.NET5项目发布部署相关的内容,示例项目以我们前一章创建的BookStore项目为例. 发布前的设置 由于新版ASP.NET5支持多版本DNX运行环境的发布和部署,所以在部署之前 ...
- 循序渐进做项目系列(5):制作安装包,谁人都可以!——VS制作安装包简明教程
一开始让我做安装包的时候,其实我是拒绝的.因为我根本就不会做安装包.查了资料之后,我很懵,很晕,很乱,因为不清晰,不简明,不直白.然而经过一番彷徨的挣扎,我终于发现:制作安装包,谁人都可以!故挥狼毫, ...
- HTML和CSS经典布局3
如下图: 需求: 1. 如图 2. 可以从body标签开始. <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xht ...