项目验收完，趁着事情不是很多，对这个项目进行梳理。我主要负责地图模块，网站其他模块主要有两个，一个是报表，主要是100多张报表，技术没有难度，主要是工作量的问题。另一个是数据的校验，就是校验数据的冲突。
 
       现在主要介绍地图，地图主要使用openlayers+geoserver，通过Geoserver加载路线以及点状物的shape数据，将各个图层形成一个图层组，页面前端用openlayers加载该图层组，然后对此图层组进行查询。这样做的好处就是，如果有新的图层增加，如果没有特殊的需求，是不需要修改代码的，只需要在Geoserver中修改图层组，增加新的图层就可以了。如果你添加的是图层的数组，你就需要修改代码，而且查询的时候，不需要单独增加遍历新的图层。公司的数据工程部，就是负责Geoserver的配图，他们交付其他项目的时候，都是这种做法。因为这个项目地图是我一个人做，所以配图就不是那么好看，中规中矩。地图中区域的铁路、湖泊等装饰性图层都没有，没有那么好看。
 
      地图主要加载的是某区域的国道（6326条路）、省道（8380条）、县道（9076条路）、乡道（7万）、村道（9万）、专道（134条）以及路线上的桥隧渡涵。为了此项目，去其他用到openlayers开发部门去借鉴经验，因为他们的项目需求定位就是只加载高速，数据量很小，直接从数据库加载，很显然对于此项目行不通，数据量太大。
 
       开发的环境是Geoserver 2.7.1.1，第一次用的Geoserver 2.6.3，后来发现它对页面中文会显示乱码（尽管已经将图层的数据存储(Store)的DBF字符集设置成GBK，可能还需要其他设置就不知道了），所以改用了新的版本 。openlayers用的是2.13.1，并不是现在最新的openlayers 3.x，尽管新的备受推崇，但是由于项目太紧，没有时间去学习和替换。

      在做项目的时候，参考了很多文章，比较有用的是longshenguoji的文章，也推荐加群OpenLayers官方旗舰群[2] （群号：274788071），里面很多高手，不过大部分都是推崇openlayers 3.x，进去的时候，还是不要做伸手党，很多官方的demo都能解决问题。
 
       以上是对项目介绍，年前打算把地图部分梳理完，预计写四章内容，第一章项目介绍以及地图加载，第二章Geoserver的配置，第三章地图的图层查询以及数据的解析，第四章地图小工具。文章中都会写一些项目中自己的体会以及经验教训，走过的弯路也算是后车之鉴，毕竟openlayers 2.x有点老了。一个人的精力毕竟是有限的，欢迎大家多交流。
     
第一章简单介绍地图的加载，下面是主要前端页面，Window.css主要是将body设置成页面全宽。
 
 
<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title ></title>

    <script src="Script/jquery-1.10.2.min.js"></ script>

    <script src="Script/OpenLayers/OpenLayers.js"></ script>

    <script src="Script/Map.js"></ script>

    <link rel="stylesheet" type="text/css" href="CSS/Window.css" />

</head>

<body>

    <div id='map' class="map">

    </div >

</body>

</html>

下面的代码是这一系列主要的内容Map.js,页面的加载，以及后面介绍的查询以及小工具 都会写在这个js里面。

var map;

//地图初始化加载

function init()

{

    var bounds = new OpenLayers.Bounds(109.62468672071573, 20.061844970906243,

                        117.35435946391824, 25.528473333333334); //地图的边界

    var options = {

        projection: "EPSG:4326",

        minResolution: "auto",

        maxResolution: "auto",

        numZoomLevels: 20,

        center: new OpenLayers.LonLat(113, 23)

    };//地图控制

    map = new OpenLayers.Map( 'map', options);

 //group就是相应的图层组，在Geoserver中该图层组叫 guangdong

    var group = new OpenLayers.Layer.WMS("group" ,

       //geoserver所在服务器地址,ip是内网的，geoserver端口是8090；

       "http://192.168.0.87:8090/geoserver/guangdong/wms" ,

       {

           layers: "guangdong",//图层组名称

           transparent: "true"

       },

        { isBaseLayer: true }

     );

    map.addLayer(group);

    map.zoomToExtent(bounds); //将地图扩大的数据

}

$(function () {

    init();

})

效果图如下：

Openlayers+Geoserver（一）：项目介绍以及地图加载的更多相关文章

  1. OpenLayers项目分析——（一）项目介绍

    OpenLayers 是由MetaCarta公司开发的,用于WebGIS客户端的JavaScript包,目前的最高版本是2.7 V,通过BSD License 发行.它实现访问地理空间数据的方法都符合 ...

  2. Hadoop学习笔记—20.网站日志分析项目案例（一）项目介绍

    网站日志分析项目案例(一)项目介绍:当前页面 网站日志分析项目案例(二)数据清洗:http://www.cnblogs.com/edisonchou/p/4458219.html 网站日志分析项目案例 ...

  3. 10年C#历程的MVP之路与MVP项目介绍

            本博客所有文章分类的总目录:http://www.cnblogs.com/asxinyu/p/4288836.html  1.意外的惊喜 10月份收到微软总部寄来的荣誉证书,非常激动, ...

  4. CoinPunk项目介绍

           CoinPunk是一个bitcoin比特币钱夹服务web应用程序,你可以自己构建钱夹服务.开源,免费. 轻量级,高效 响应式设计 轻易创建新账户 详细的交易记录 构建于Node.js与H ...

  5. Android Hotpatch系列之-项目介绍

    给现实Android apk打补丁,不用强迫客户升级客户端,悄悄的就把bug修复了,程序猿再也不用被老大骂娘了. 客户端例子实现:https://github.com/fengcunhan/Hotpa ...

  6. xcode新建项目介绍

    xcode新建项目介绍 1.打开xcode选择“create a new xcode project 2.product name 工程名称 campany identifter 公司id 一般都写公 ...

  7. 斗地主算法的设计与实现--项目介绍&如何定义和构造一张牌

    本篇主要讲解斗地主中如何比较两手牌的大小. 友情提示:本篇是接着以下两篇文章就讲解的,建议先看看下面这2篇. 斗地主算法的设计与实现--如何判断一手牌的类型(单,对子,三不带,三带一,四代二等) 斗地 ...

  8. Oschat IM 开源即时通讯项目介绍 - FengJ的个人页面 - 开源中国社区

    Oschat IM 开源即时通讯项目介绍 - FengJ的个人页面 - 开源中国社区 Oschat IM 开源即时通讯项目介绍    255人收藏此文章, 我要收藏 发表于5天前(2013-08-28 ...

  9. NiftyNet项目介绍

    NiftyNet项目介绍  简述  NiftyNet是一款开源的卷积神经网络平台,旨在通过实现医学图像分析的深度学习方法和模块,支持快速原型和再现性,由WEISS (Wellcome EPSRC Ce ...

随机推荐

  1. JS,JQuery的扩展方法

    转 http://blog.csdn.net/tuwen/article/details/11464693 //JS的扩展方法: 1 定义类静态方法扩展 2 定义类对象方法扩展            ...

  2. mongodb遇到的错误

    1. [root@localhost bin]# ./mongod -dbpath /data/db --logpath /usr/local/mongodb/log --13T18:: F CONT ...

  3. scala变量

    #声明与定义(赋值) val  常量声明  val x:T  val x:T=e  (x:名字,T:类型,e:值) var 变量声明  var x:T  var x:T=e #类型省略(默认类型) v ...

  4. Win10怎么设置始终以管理员身份运行应用程序

    第一步.对着Win10应用程序桌面图标单击鼠标右键,菜单中选择“属性”; 第二步.在程序属性对话框,点击切换到“兼容性”选项卡,找到并勾选“设置”项目下的“以管理员身份运行此程序”后,点击确定即可. ...

  5. @ViewDebug.ExportedProperty的使用

    原文链接:http://daemon369.github.io/android/2014/06/12/android-viewdebug-exportedproperty/ http://www.eo ...

  6. Could not synchronize database state with session

    今天做一个简单保存时,db2数据库报的错误,网上收集了下问题的解决办法~ 1.主键不是自动生成的,然后自己没手动设置. 2.插入的实体字段跟数据库的关键字冲突. 3.更新的时候,如果更新一个不存在的i ...

  7. Tomcat 设置

    bin/catalina.bat--增加内存 set JAVA_OPTS=...后面加上 set JAVA_OPTS=-Xmx1024M -Xms512M -XX:MaxPermSize=256m c ...

  8. 利用Native Client OLEDB 11 高效率地对SQL SERVER 进行查询和插入操作

    前言: 鄙司原始用的都是ADO来访问数据库,而我现在着手的项目是从我的GPS历史数据库中,取出历时数据的一个接口,一个DLL.用ADO写完之后,测试下来,平均4000条的数据,需要 180 毫秒左右. ...

  9. 在Windows下编译扩展OpenCV 3.1.0 + opencv_contrib

    为什么要CMake,这里我陈述自己的想法,作为一个刚使用opencv库的小白来说,有以下大概三点内容 1.由于在学习图像处理滤波器中,需要用到各种边缘保护滤波器(EPS)算法,但是这些算法在OpenC ...

  10. Zookeeper的基础知识

    1.Zookeeper是什么? 引用官方的说法:“Zookeeper是一个高性能,分布式的,开源分布式应用协调服务.它提供了简单原始的功能,分布式应用可以基于它实现更高级 的服务.它被设计为易于编程, ...