便捷构建简单GIS应用平台
如您希望在不搭建GIS服务器的条件下快速拥有GIS服务能力,SuperMap Online提供以租代买的方式搭建专属GIS服务器。基于GIS数据存储,您可以便捷地上传数据和发布服务。同时结合为您提供的API服务进行二次开发。
本例将带领您:上传数据,将数据发布为REST地图服务并设置为公开,同时在您自己的网页中进行调用。示例数据为京津地区地图,点击下载示例数据。
在您的网页中调用REST服务
Step1 上传数据并发布服务
在SuperMap Online中依次点击“资源中心”和“数据”,在数据页面点击“上传数据”。在上传数据页面选择数据类型为“SuperMap工作空间数据”,选择上传文件点击下一步,服务类型选择“REST地图服”点击“上传并发布 ”。
Step2 将REST地图服务设置为公开并复制地址
点击“共享”按钮,点击“开启共享”,依次选择“开启共享”、“公开下载”,点击“保存”。
返回数据页面,点击发布好的服务链接,在弹出页面点击“maps”,选择对应地图名称并复制当前网页地址。
Step3 构建网页调用地图
现在,您可以调用REST服务进行二次开发。以SuperMap iClient for OpenLayer为例,输入如下示例代码即可在您的网页中调用您刚发布的REST地图服务。
<!DOCTYPE html>
<html>
//引入脚本
<head>
<meta charset="UTF-8">
<link href="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/css/ol.css" rel="stylesheet" />
<link href='https://iclient.supermap.io/dist/ol/iclient-ol.min.css' rel='stylesheet' />
<script type="text/javascript" src="https://cdn.jsdelivr.net/gh/openlayers/openlayers.github.io@master/en/v6.4.3/build/ol.js"></script>
<script type="text/javascript" src="https://iclient.supermap.io/dist/ol/iclient-ol.min.js"></script>
</head>
//插入地图
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%; position: absolute;top: 0;">
<div id="map" style="width: 100%;height:100%"></div>
<script type="text/javascript">
var map, url = "https://www.supermapol.com/proxy/iserver/services/map_jingjin_nv35yfs1/rest/maps/京津地区地图"; 此处为您调用的REST地图服务的地址。
map = new ol.Map({
target: 'map',
controls: ol.control.defaults({attributionOptions: {collapsed: false}})
.extend([new ol.supermap.control.Logo()]),
view: new ol.View({
center: [0, 0],
zoom: 2,
projection: 'EPSG:4326',
multiWorld: true
})
});
var layer = new ol.layer.Tile({
source: new ol.source.TileSuperMapRest({
url: url,
wrapX: true
}),
projection: 'EPSG:4326'
});
map.addLayer(layer);
map.addControl(new ol.supermap.control.ScaleLine());
</script>
</body>
</html>
如您不希望将您的服务设置为公开,您需要先申请key,后在网页中调用您的REST地图服务,此外您还可以直接调用数据上图中制作的地图,或调用REST数据服务实现数据查询等功能,点击了解更多REST服务的调用方法。