从网上下载openlayers2，解压取得img theme 文件夹和openlayes.js文件。放在同一文件夹下用phpstorm打开。

创建index.html-------------每一行都有注释

<!DOCTYPE html>

<html lang='en'>

<head>

    <meta charset='utf-8'/>

    <title>My OpenLayers Map</title>

    <script type='text/javascript' src='OpenLayers.js'></script>//载入库文件

    <script type='text/javascript'>//js脚本，可以单独创建js文件，载入到html

        var map;//创建一个名为map的全局变量。

        function init() {

            map = new OpenLayers.Map('map_element', {});//从地图上创建一个映像对象类

            //第一个参数--map_element显示地图的html文件中的ID 　第二个参数是地图的选项

            var wms = new OpenLayers.Layer.WMS(//创建一个层对象映射到使用WMS层类的子类。

                    'OpenLayers WMS',//层的标题，在控制层列表增加可读性

                    'http://vmap0.tiles.osgeo.org/wms/vmap0',//URL是第二个参数,期望获得的WMS层类。

                    {layers: 'basic'},//键值对 返回"basic"层

                    {}

            );//WMS,代表网络地图服务　　一个国际标准定义的开放地理联盟(OGC)。

            map.addLayer(wms);//将图层添加到地图

            if (!map.getCenter()) {//定义地图的范围

                map.zoomToMaxExtent();//地图缩放地图的最大程度

                /**

                 * 其他控制大小的方法

                 * map.zoomToExtent(new OpenLayers.Bounds([minx,miny,maxx,maxy]);

                 *

                 * map.setCenter(new OpenLayers.LonLat(x,y));

                 * map.zoomTo(5);//x,y是经度/纬度值,5是你想放大的缩放级别。

                 *

                 */

            }

        }

    </script>

</head>

<body onload='init();'>

<div id='map_element' style='width: 500px; height: 500px;'>

</div>//为地图创建HTML元素

</body>

</html>

OpenLayers.2.10.Beginners.Guide---第一章的更多相关文章

  1. ASM学习笔记--ASM 4 user guide 第一章翻译

    ASM是什么? 借用别人的话 :ASM 是一个 Java 字节码操控框架.它能被用来动态生成类或者增强既有类的功能. ASM 可以直接产生二进制 class 文件,也可以在类被加载入 Java 虚拟机 ...

  2. 《驾驭Core Data》 第一章 Core Data概述

    <驾驭Core Data>系列教程综合了<Core Data for iOS>,<Learning Core Data for iOS>,<Core Data ...

  3. [ABP教程]第一章 创建服务端

    Web应用程序开发教程 - 第一章: 创建服务端 关于本教程 在本系列教程中, 你将构建一个名为 Acme.BookStore 的用于管理书籍及其作者列表的基于ABP的应用程序. 它是使用以下技术开发 ...

  4. 《Django By Example》第一章 中文 翻译 （个人学习，渣翻）

    书籍出处:https://www.packtpub.com/web-development/django-example 原作者:Antonio Melé (译者注:本人目前在杭州某家互联网公司工作, ...

  5. Nova PhoneGap框架 第一章 前言

    Nova PhoneGap Framework诞生于2012年11月,从第一个版本的发布到现在,这个框架经历了多个项目的考验.一直以来我们也持续更新这个框架,使其不断完善.到现在,这个框架已比较稳定了 ...

  6. 第一章 Java多线程技能

    1.初步了解"进程"."线程"."多线程" 说到多线程,大多都会联系到"进程"和"线程".那么这两者 ...

  7. 【读书笔记】《编程珠玑》第一章之位向量&位图

    此书的叙述模式是借由一个具体问题来引出的一系列算法,数据结构等等方面的技巧性策略.共分三篇,基础,性能,应用.每篇涵盖数章,章内案例都非常切实棘手,解说也生动有趣. 自个呢也是头一次接触编程技巧类的书 ...

  8. 《JavaScript高级程序设计（第3版）》阅读总结记录第一章之JavaScript简介

    前言: 为什么会想到把<JavaScript 高级程序设计(第 3 版)>总结记录呢,之前写过一篇博客,研究的轮播效果,后来又去看了<JavaScript 高级程序设计(第3版)&g ...

  9. 第一章.C语言简介

    C语言第一章 C语言简介   目录 一.C语言介绍 二.C语言特点 三.Hello World 四.转义符 五.占位符 六.俄罗斯方块游戏 七.文件下载 一.C语言介绍 C是一种通用的编程语言,广泛用 ...

随机推荐

  1. Python 【第十章】 Django路由

    路由可以简单理解就是 URL -> 函数名 例如: /login1/ -> 函数名 urls.py文件中 urlpatterns = [ # url(r'^admin/', admin.s ...

  2. Android Stdio 调试Smali

    一 安装插件 1)Android stdio 安装插件 二 反编译smali 1)java -jar baksmali-2.1.2.jar app-debug.apk -o test/src2)and ...

  3. div内容溢出时显示滚动条

    在style中添加overflow:scroll属性即可.

  4. 前端CDN公共库

    通过使用公共的CDN脚本和样式库,可以在一定程度上加速访问.节省服务器流量.提升你的网站用户体验.本文将介绍国内比较常用的几种免费的CDN库,包括百度.新浪.360.又拍和七牛等. 百度CDN公共库 ...

  5. Docker命令详解

    Docker命令详解   最近学习Docker,将docker所有命令实验了一番,特整理如下: # docker --help Usage: docker [OPTIONS] COMMAND [arg ...

  6. PHP中explode和implode的区别

    字符串的连接与分割是非常重要的两个内容,通过其可以将数组按照指定的规则转换成字符串,也可以将字符串按照指定的规则进行分割,返回一个数组.其应用范围很广,如在购物网站的购物车,在线投票系统等.这两项技术 ...

  7. 【转】[Intel/Nvidia]Ubuntu 16.04 LTS Intel/Nvidia双显卡切换

    1.在Unity中搜索 "Additional Drivers" 2.打开并选择以下选项 3.打开终端并输入 sudo apt-get install nvidia-361 4.安 ...

  8. python 反射

    python 反射的核心本质其实就是利用字符串的形式去对象(模块)中操作(查找/获取/删除/添加)成员,一种基于字符串的事件驱动! 反射的四个基本函数使用 hasattr,getattr,setatt ...

  9. Java集合之ArrayList

    ArrayList ArrayList是最常见以及每个Java开发者最熟悉的集合类了,顾名思义,ArrayList就是一个以数组形式实现的集合,以一张表格来看一下ArrayList里面有哪些基本的元素 ...

  10. nginx服务器命令

    nginx -s reload  :修改配置后重新加载生效 nginx -s reopen  :重新打开日志文件nginx -t -c /path/to/nginx.conf 测试nginx配置文件是 ...