（转）Openlayers 2.X加载高德地图
http://blog.csdn.net/gisshixisheng/article/details/44853881
概述：
前面的有篇文章介绍了Openlayers 2.X下加载天地图，本节介绍Openlayers 2.X下加载高德地图。
实现效果：
高德地图
高德影像
图中：蓝色的省市边界为我本机发布的，能够与高德地图很好地结合在一起。
实现：
实现很简单的，主要是要获取地图的url，在Arcgis for js加载百度地图一文（http://blog.csdn.net/gisshixisheng/article/details/44853709）中做了介绍，在此不再赘述，实现代码如下：
- <!DOCTYPE html>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
- <meta name="apple-mobile-web-app-capable" content="yes">
- <title>OpenLayers MapQuest Demo</title>
- <link rel="stylesheet" type="text/css" href="http://200.200.200.222/OpenLayers-2.12/theme/default/style.css"/>
- <style type="text/css">
- html, body, #map{
- padding:0;
- margin:0;
- height:100%;
- width:100%;
- }
- </style>
- <script type="text/javascript" src="http://200.200.200.222/OpenLayers-2.12/OpenLayers.js"></script>
- <script type="text/javascript">
- var map;
- function init(){
- var vecLayer = new OpenLayers.Layer.XYZ("高德矢量", [
- "http://webrd01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
- "http://webrd02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
- "http://webrd03.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}",
- "http://webrd04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x=${x}&y=${y}&z=${z}"
- ], {
- isBaseLayer: true,
- visibility: true,
- displayInLayerSwitcher: true
- });
- var imgLayer = new OpenLayers.Layer.XYZ("高德栅格", [
- "http://webst01.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=6&x=${x}&y=${y}&z=${z}",
- "http://webst02.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=6&x=${x}&y=${y}&z=${z}",
- "http://webst03.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=6&x=${x}&y=${y}&z=${z}",
- "http://webst04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=6&x=${x}&y=${y}&z=${z}"
- ], {
- isBaseLayer: true,
- visibility: true,
- displayInLayerSwitcher: true
- });
- map = new OpenLayers.Map("map",{
- projection: "EPSG:900913",
- displayProjection: "EPSG:4326",
- units: 'm',
- layers: [vecLayer, imgLayer],
- numZoomLevels:20,
- center: [11858238.665397, 4762368.6569168],
- zoom: 5
- });
- map.addControl(new OpenLayers.Control.LayerSwitcher());
- map.addControl(new OpenLayers.Control.MousePosition());
- var wms = new OpenLayers.Layer.WMS(
- "省级行政区",
- "http://200.200.200.220:8080/geoserver/wms",
- {
- LAYERS: "pro",
- transparent:true
- },
- {
- singleTile: false,
- ratio: 1,
- isBaseLayer: false,
- visibility:true,
- yx : {'EPSG:4326' : true}
- }
- );
- map.addLayer(wms);
- }
- </script>
- </head>
- <body onload="init()">
- <div id="map"></div>
- </body>
（转）Openlayers 2.X加载高德地图的更多相关文章
- OpenLayers加载高德地图离线瓦片地图
本文使用OpenLayers最新版本V5.3.0演示:如何使用OpenLayer加载谷歌地球离线瓦片地图.OpenLayers 5.3.0下载地址为:https://github.com/openla ...
- arcgis 加载高德地图 es6的方式
目前很多arcgis 加载高德地图是dojo的方式 外部引入文件,现在改成这种方式 /** * Created by Administrator on 2018/5/14 0014. */ impor ...
- Vue异步加载高德地图API
项目中用到了高德地图的API以及UI组件库,因为是直接把引入script写在index.html中,项目打包后运行在服务器,用浏览器访问加载第一次时会非常慢,主要原因是加载高德地图相关的js(近一分钟 ...
- vue 里面异步加载高德地图
前言 关于Vue 里面使用异步加载高德地图 项目中其实只有几处需要用到地图,不需要全局引入 在index文件中引入js会明显拖慢首屏加载速度,虽然可以使用异步加载script的方式解决,但是始终觉得不 ...
- openLayers加载高德地图
之前用openlayers对高德,百度,腾讯,bing,supermap,天地图,arcgis,google等地图进行了对接,今天简单介绍一下openlayers+高德: 在Openlayers.La ...
- Arcgis api For silverlight 加载高德地图
原文 http://www.cnblogs.com/thinkaspx/archive/2012/11/13/2767752.html 地图仅供演示,研究使用.如要商用 请联系厂商. public c ...
- iOS unity 互相调用加载高德地图时
需要增加 mapView.delegate = self 这是一种设计模式,有的人称为代理,有的人称为委托,比如有A,B两个控制器,由A可以push到B,B可以pop回A,现在有一种情况,A中有一个l ...
- Leaflet 测试加载高德地图
<!DOCTYPE html> <html> <head> <title>Leaflet Quick Start Guide Example</ ...
- ArcGIS加载高德、OSM和谷歌等地图
1. 引言 网络地图对于我们来说已经不是什么新鲜事了,上面有各大互联网公司收集的海量的地理空间数据.一般网络地图的地图是以切片形式存在的,因此,本文重点讲述如何将这些网络切片地图加载并显示再ArcGI ...
随机推荐
- Git学习总结（3）——代码托管平台简介
可以说GitHub的出现完全颠覆了以往大家对代码托管网站的认识.GitHub不但是一个代码托管网站,更是一个程序员的SNS社区.GitHub真正迷人的是它的创新能力与Geek精神,这些都是无法模仿的. ...
- noip模拟赛 a
分析:f(n)就是问有多少对a*b*c = n,如果是Σf(i),那就是问有多少对a*b*c <= n. 这道题和之前做过的一道数三角形的题差不多:传送门,先假设一下a <= b < ...
- 浅析gcc、arm-linux-gcc和arm-elf-gcc关系
浅析gcc.arm-linux-gcc和arm-elf-gcc关系 一.GCC简介 The GNU Compiler Collection,通常简称 GCC,是一套由 GNU 开发的编译器集,为什么是 ...
- http-runtime属性
配置httpRuntime也可以让FileUpload上传更大的文件,不过设置太大了会因用户将大量文件传递到该服务器而导致的拒绝服务攻击(属性有说明) 属性 属性 选项 说明 appRequestQu ...
- Python图像处理库PIL中图像格式转换（一）
在数字图像处理中,针对不同的图像格式有其特定的处理算法. 所以,在做图像处理之前,我们须要考虑清楚自己要基于哪种格式的图像进行算法设计及事实上现.本文基于这个需求.使用python中的图像处理库PIL ...
- 如何将unity资源窗体中的文件一下所有折叠/打开
1.选中父物体 2.按住alt 3.再按下键盘上的左键/右键:此父物体下的所有折叠/打开 或者 alt + LMB 点击所要折叠/打开的父物体左边的小三角
- luogu3225 [HNOI2012]矿场搭建
题目大意 给出一个有$n(n\leq 500)$个节点的无向图,一个满足条件的点集$V$会使得对于图中的每一个节点$u$,满足路径起点为$u$终点$v\in V$的路径集合$P_u$中总存在至少两条路 ...
- C# winform KeyPress 事件中对应的数字
C# winform KeyPress 事件中对应的数字所有e.KeyChar值的意思 常用ASCII码表 你自己看看应该就明白了 键盘 ASCII码 键盘 ASCII码 ESC 27 7 55 S ...
- ningbooj--1655--木块拼接（贪心）
[1655] 木块拼接 时间限制: 1000 ms 内存限制: 65535 K 问题描述 好奇的skyv95想要做一个正方形的木块,现在有三种颜色的矩形木块,颜色分别为"A" ...
- RTP协议分析和详解
一.RTP协议分析 第1章. RTP概述 1.1. RTP是什么 RTP全名是Real-time Transport Protocol(实时传输协议).它是IETF提出的一个标准,对应的RF ...