<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>openlayers3调用谷歌离线地图</title>
<link rel="stylesheet" href="ol.css" />
<script type="text/javascript" src="ol.js"></script>
<style>
html{
height: 100%;
width: 100%;
padding:0;
margin:0;
}
body{
height: 100%;
width: 100%;
padding:0;
margin:0;
}
.map {
height: 100%;
width: 100%;
}
</style>
</head>
<body>
<div id="map" class="map"></div>
<script>
//定义一个地图调用函数
//var maphost = "http://localhost:8080/ol/dist";
//var maphost2 = "http://localhost:8080/Apps";
var BaseMapLayer = function(options) {
var mapExtent = [115.94835, 39.66765, 116.99815, 40.13703];
var layer = new ol.layer.Tile({
extent: ol.proj.transformExtent(mapExtent, "EPSG:4326", "EPSG:3857"),
source: new ol.source.XYZ({
url: options.url,
tilePixelRatio: 1,
minZoom:2,
maxZoom:12
})
});
return layer;
};
//定义视图
var view = new ol.View({
center: ol.proj.fromLonLat([116.39360, 39.92634]),
zoom: 12,
minZoom: 6,
maxZoom: 12
});
//定义地图服务URL
<!-- var sateliteopt = { -->
<!-- url: '/data/google/satellite_en/{z}/{x}/{y}.jpg' -->
<!-- }; -->
var sateliteopt = {
url: 'data/google/satellite_en/{z}/{x}/{y}.jpg'
};
//影像地图组
var sate = new ol.layer.Group({
layers: [
new BaseMapLayer(sateliteopt)
]
});
//创建地图
var map = new ol.Map({
view: view,
layers: [
sate
],
target: 'map'
});
</script>
</body>
</html>
openlayers加载本地离线地图瓦片（重新发2018-10-23）
4星 · 超过85%的资源 需积分: 44 56 浏览量
2018-10-24
00:10:29
上传
评论 9
收藏 1.49MB RAR 举报 
本地离线openlayers加载本地地图离线瓦片范例.rar （46个子文件） 
emss.html 2KB
data google satellite_en 12 3374 
1551.jpg 21KB 1550.jpg 20KB 1553.jpg 19KB 1552.jpg 20KB 3373 1551.jpg 21KB 1550.jpg 21KB 1553.jpg 21KB 1552.jpg 21KB 3371 1551.jpg 21KB 1550.jpg 21KB 1553.jpg 20KB 1552.jpg 21KB 3370 1551.jpg 20KB 1550.jpg 18KB 1553.jpg 19KB 1552.jpg 20KB 3372 1551.jpg 20KB 1550.jpg 21KB 1553.jpg 20KB 1552.jpg 20KB 3369 1551.jpg 18KB 1550.jpg 14KB 1553.jpg 20KB 1552.jpg 19KB 8 210 97.jpg 17KB 96.jpg 16KB 10 842 388.jpg 20KB 387.jpg 19KB 843 388.jpg 20KB 387.jpg 21KB 7 105 48.jpg 15KB 9 421 193.jpg 18KB 194.jpg 19KB 11 1684 775.jpg 18KB 776.jpg 20KB 1687 775.jpg 20KB 776.jpg 21KB 1685 775.jpg 20KB 776.jpg 20KB 1686 775.jpg 21KB 776.jpg 21KB 6 52 24.jpg 13KB baidu 
ol.css 3KB ol.js 503KB ol-debug.js 3.72MB资源评论
mrkang0072020-06-11可以展示,但是没有配合geo server
布达拉三世2018-11-09可以运行，是一种实现思路，你qq多少，加你讨论下gis问题
gis_idea2018-12-02qq:1006861321 欢迎交流~
