水经注离线谷歌卫星地图加载服务中间件调用示例ForGoogle API
1.说明
水经注离线谷歌卫星地图加载服务中间件可利用离线地图
的.dat文件在本地建立服务端,并生成影像、标签、高程等服务地址,可以在Goo gle API中直接调用该服务地址,并将请求到的服务资源显示在前端,当请求的地图资源不存在可通过网络直接下载缺
失的地图,并储存在.dat文件中。
2.实现
2.1准备GoogleMa pAPIV3
下载GoogleMap APIV3.rar。
在其目录下新建一个ht ml文件“RiverM apSer verSa mpleFor Google API.html”,如下图。
利用记事本打开“RiverM apSer verSa mpleFor Google API.html”并进行编辑,具体内容如下。
<!DOCTYP E html>
<html>
<head>
<meta http-equiv="Conten t-Type" conten t="text/html; charse t=utf-8" />
<title>RiverM apSer verSa mpleFor Google API</title>
<link href="mapfil es/css/defaul t.css" rel="styles heet" type="text/css" />
<script type="text/javasc ript" src="mapapi.js"></script>
<script>
functi on tlen(len, mystr){
mystr= String(mystr);
var num = len - mystr.length;
for (var i = 0; i <= num; i++)
{
mystr= "0" + mystr;
}
return mystr;
};
functi on CoordM apTyp e(tileSi ze) {
this.tileSi ze = tileSi ze;
}
CoordM apTyp e.protoTil e = functi on(coord, zoom, ownerD ocume nt) { var div = ownerD ocumate Eleme nt('DIV');
var ymax = 1 << zoom;
var y = coord.y;
y = tlen(5,y);
var x = tlen(5,coord.x);
zoom = tlen(1,zoom+1);
div.innerH TML = y + "," + x + "," + zoom;
div.style.width= this.tileSi ze.width+ 'px';
div.style.height = this.tileSi ze.height + 'px';
div.style.fontSi ze = '10';
div.style.border Style = 'solid';
div.style.border Width = '1px';
div.style.border Color = '#AAAAAA';
return div;
};
functi on LocalM apTyp e() {}
LocalM apTyp e.protot ype.tileSi ze = new google.maps.Size(256, 256);
LocalM apTyp e.protot ype.maxZoo m = 20;
LocalM apTyp e.protot ype.minZoo m = 0;
LocalM apTyp e.prototype.name = "本地";
LocalM apTyp e.prototype.alt = "显示本地地图";
LocalM apTyp e.protoTil e = functi on(coord, zoom, ownerD ocume nt) { var img = ownerD ocumate Eleme nt("img");
img.style.width= this.tileSi ze.width+ "px";
img.style.height = this.tileSi ze.height + "px";
var ymax = 1 << zoom;
var y = coord.y;
y = tlen(5,y);
var x = tlen(5,coord.x);
zoom = tlen(1,zoom+1);
var strURL = "127.0.0.1:1002/getDef inedI mage?" + "x=" + x + "&y=" + y + "&z=" + zoom;
img.src = strURL;
return img;
};
var localM apTyp e = new LocalM apTyp e();
functi on initia lize() {
go2map地图北京var myLatl ng = new google.maps.LatLng(30, 103);
var myOpti ons = {
center: myLatl ng,
zoom: 4,
street ViewC ontro l: false,
mapTyp eCont rolOp tions: {
m apTyp eIds: ["local", google.maps.MapTyp eId.ROADMA P] }
};
var map = new google.maps.Map(documEle mentB yId("map_ca nvas"), myOpti ons);
map.mapTyp es.set('local', localM apTyp e);
map.setMap TypeI d('local');
map.overla yMapT ypes.insert At(0, new CoordM apTyp e(new google.maps.Size(256, 256)));
}
</script>
</head>
<body onLoad="initia lize()">
<div id="map_ca nvas" style="width: 640px; height: 480px;"></div>
</body>
</html>
其中【strURL=”localh ost:1002/getDef inedI mage ?”】表示请求的是影像、地图、地形、标签、影像+标签、影像+地图、影像+地形或Dem。具体根据Ri verMa pServ er的启动配置参数来确定。
例如:RiverM apSe “1002”“Image_Label”“c:\test\tile”“c:\test\label”表示此应用输出合并底图(可以为影像、地图、地形任意一种)和标签两个地图瓦片。RiverMapSe “1002”“Image”“c:\test\tile”表示此应用输出地图底图(可以为影像、地图、地形任意一种)
2.2启动RiverMap Serve r
启动RiverMapS erver有两种方式都可以正常运行。
2.2.1直接运行R iverM apSer ver
通过conf ig.ini文件配置参数,如下图。
PORT=1002 表示端口为1002;GetFil eType=Image_Label表示此应用输出合并底图(可以为影像、地图、地形任意一种)和标签
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论