Openlayers Demo:

  1. <html>
  2. <head>
  3. <title>OpenLayers Example</title>
  4. <script src="OpenLayers.js"></script>
  5. </head>
  6. <body>
  7. <style type="text/css">
  8. .Third{
  9. margin: 10px 0;
  10. padding: 6px 20px;
  11. font-family: 'Microsoft Yahei';
  12. margin: 15px 0;
  13. font-size: 16px;
  14. color: fff;
  15. background: #C6EFD2;
  16. color: #999;
  17. border-radius: 4px;
  18. clear: both;}
  19. .Highlighter{
  20. border: solid 1px #ccc;
  21. clear: both;}
  22. </style>
  23. <div class="Third"><h1>欢迎来到我的世界!</h1></div>
  24. <div class="Highlighter" style="width:100%; height:100%" id="map"></div>
  25. <script defer="defer" type="text/javascript">
  26. var map = new OpenLayers.Map('map');
  27. var bounds = new OpenLayers.Bounds(
  28. -124.73142200000001, 24.955967,
  29. -66.969849, 49.371735
  30. );
  31. var wms = new OpenLayers.Layer.WMS( "WMS Layer",
  32. "http://localhost:8080/geoserver/topp/wms", {LAYERS: 'topp:states'} );
  33. //var osm = new OpenLayers.Layer.OSM();
  34. //map.addLayer(osm);
  35. map.addLayer(wms);
  36. map.zoomToExtent(bounds);
  37. //map.zoomToMaxExtent();
  38. </script>
  39. </body>
  40. </html>

Openlayers版本:OpenLayers-2.13.1

效果截图:

阅读:

OGC标准地图服务介绍 http://blog.csdn.net/wildboy2001/article/details/7743350

[GeoServer]Openlayers简单调用的更多相关文章

  1. 使用GeoServer+OpenLayers发布和调用WMTS、Vector Tile矢量切片服务 | Publishing and Calling WMTS, Vector Tile Service Using GeoServer + OpenLayers

    Web GIS系列: 1.搭建简易Web GIS网站:使用GeoServer+PostgreSQL+PostGIS+OpenLayers3 2.使用GeoServer+QGIS发布WMTS服务 3.使 ...

  2. Geoserver+Openlayers+MySQL设计思想,GeoServer服务器搭建(Docker构建镜像)

    Geoserver+Openlayers+MySQL设计思想,GeoServer服务器搭建(Docker构建镜像) 一.geoserver+openlayers+mysql主要设计思想 1.1 Geo ...

  3. 路径分析—PostgreSQL+GeoServer+Openlayers(二)

    路径分析-QGIS+PostgreSQL+PostGIS+pgRouting(一) 路径分析-PostgreSQL+GeoServer+Openlayers(二) 前言 上一篇文章中实现数据库层面的路 ...

  4. loadrunner做webservice接口之简单调用

    今天听大神讲了webservice做接口,我按照他大概讲的意思自己模拟实战了下,可能还有很多不对,一般使用webservice做接口,会使用到soapui,但是用了loadrunner以后发现lr很快 ...

  5. 【Android进阶】Android程序与JavaScript之间的简单调用

    本篇将讲解一个简单的Android与JavaScript之间的简单调用的小程序 效果图 工程结构 HTMLActivity.java代码 package com.example.javatojs; i ...

  6. 原生js简单调用百度翻译API实现的翻译工具

    先来个在线demo: js翻译工具 或者百度搜索js简单调用百度翻译API工具(不过有个小小的界面显示bug,我想细心的人应该会发现) 或者直接前往该网址:js翻译工具 或者前往我的github:gi ...

  7. StreamReader 和 StreamWriter 简单调用

    /* ######### ############ ############# ## ########### ### ###### ##### ### ####### #### ### ####### ...

  8. 经测试稳定可用的蓝牙链接通信Demo,记录过程中遇到的问题的思考和解决办法,并整理后给出一个Utils类可以简单调用来实现蓝牙功能

    说明:这是本人在蓝牙开发过程中遇到过的问题记录和分析,以及解决办法. 在研究过程中,许多的前人给出的解决方案和思路指导对我相当有帮助,但并非都是可采取的解决方法, 经过本人对这些方法的测试和使用过后, ...

  9. jQuery懒加载插件 – jquery.lazyload.js简单调用

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

随机推荐

  1. 当Editplus遇到Java的Scanner

    学习Java编程时,我想让变量的值从键盘输入接收进来.平时在dos中运行效果很直观,那么我在Editplus这款开发工具中也可以输入,Editplus是带有控制台.当你运行Java程序时,此时出现的编 ...

  2. PHP 开发 APP 接口 学习笔记与总结 - APP 接口实例 [3] 首页 APP 接口开发方案 ② 读取缓存方式

    以静态缓存为例. 修改 file.php line:11 去掉 path 参数(方便),加上缓存时间参数: public function cacheData($k,$v = '',$cacheTim ...

  3. 代理和block反向传值

    代理传值: // SendViewController.h #import <UIKit/UIKit.h> @protocol SendInFor <NSObject> -(v ...

  4. 神奇的 echo 命令

    #!/bin/bash 请输入密码,输入密码的时候不能看见因为颜色设置成跟背景色一样了,输入完密码进行加密,加密后保存在pass.txt echo "Please input a passw ...

  5. 20145317彭垚 《Java程序设计》第五次实验报告

    20145317彭垚实验五 Java网络编程及安全 北京电子科技学院(BESTI)实验报告 课程:Java程序设计 班级:1453 指导教师:娄嘉鹏 实验日期:2016.05.06 18:30-21: ...

  6. hot code replace

    http://wiki.eclipse.org/FAQ_What_is_hot_code_replace%3F https://social.msdn.microsoft.com/Forums/vst ...

  7. springMVC框架下——通用接口之图片上传接口

    我所想要的图片上传接口是指服务器端在完成图片上传后,返回一个可访问的图片地址. spring mvc框架下图片上传非常简单,如下 @RequestMapping(value="/upload ...

  8. [have_fun] 好玩哒小游戏又来啦

    联机贪吃蛇,相互厮杀,试一下吧! http://splix.io/

  9. 低功耗蓝牙4.0BLE编程-nrf51822开发(11)-蓝牙串口代码分析

    代码实例:点击打开链接 实现的功能是从uart口发送数据至另一个蓝牙串口,或是从蓝牙读取数据通过uart打印出数据. int main(void) { // Initialize leds_init( ...

  10. Decimal、 Float、 Double 使用

    一.Java 1.float型定义的数据末尾必须 有"f "或"F",为了和double区别.例float x=123.456f,  y=2e20f; publ ...