在项目中使用超图云地图


在以地理信息为中心的系统研发中,地理信息的的具体表现形式是地理数据和经过整饰的地图。在很长一段时间内,地理数据的获取因为费用和实效的因素,在项目开发中占用较多的资源,而地图的整饰工艺也因存在较高的技术门槛,占用了较多的技术人员精力。SuperMap Online基于这些存在的问题,提供了一套轻便、高效的解决方案。在本文中将会介绍如何在项目中只需要关注自己的业务数据,而快速在项目中使用超图云地图数据。

在桌面软件中配置业务数据

SuperMap iDesktop是一款桌面级专业GIS应用软件,可以用来将业务数据 处理成为SuperMap Online可以支持的格式。

SuperMap iDesktop可以在超图技术资源中心下载:链接(附三个月许可)

1. 在iDesktop中加载GIS数据

下载和安装iDesktop后,依次点击“文件”、“示范数据”,可以看到目前已有的可用示范数据。本例使用工作空间列表中的[京津地区数据]。

2. 在iDesktop中查看GIS数据

单击左侧[地图]列表查看工作空间中包含的所有地图,这里选择使用[京津地区土地利用现状图],双击打开它.

3. 为地图设置动态投影

接下来,需要设置地图的动态投影。

Q:为什么要设置动态投影?

A:SuperMap Online提供的超图云地图使用的坐标系为[Sphere Mercator],而在iDesktop中提供的 “京津地区数据”使用的坐标系为[WGS 1984],为了确保两份数据能正常叠加使用,这里需要将京津地区数据动态投影为[Sphere Mercator]。

Q:什么是动态投影?

A:SuperMap iDesktop中提供的地图投影功能,是在不改变数据集实际坐标系的基础上,以动态的方式将地图切换成不同的 坐标系进行显示的功能,详细说明可参考SuperMap iDesktop帮助文件。

为地图设置动态投影,操作步骤如下:

  • 在iDesktop顶部的工具栏中,切换到“地图”选项卡,然后点击[属性]按钮。(或在地图窗口内任意位置,点击右键选择[属性])。
  • 打开地图属性后,可以看到窗口右侧弹出[地图属性]设置对话框,需要依次设置以下属性:
  • 勾选[动态投影]复选框
  • 点击[投影设置]按钮,在弹出的对话框中设置坐标系为[Sphere Mercator]。
  • 点击[应用],保存设置

地图进行动态投影后,会因为数据范围发生变化而与当前视窗不匹配,此时点击“地图”选项卡下的“全幅”按钮即可查看动态投影后的地图。

4. 保存地图和工作空间

切换到地图属性窗口,切换到[范围]选项卡,取消[自定义全幅范围]复选框。

接下来,点击界面顶端选项卡中的[保存地图]和[保存工作空间],完成数据的配置。

最后,将数据中的工作空间文件(.smwu) 和 数据文件(.udb *.udd) 压缩为Zip文件,待在SuperMap Online中使用。

在SuperMap Online 中发布数据

1. 在浏览器中打开SuperMap Online 并登录

在浏览中输入地址 http://www.supermapol.com,注册并登录

2. 上传在iDesktop中配置完成的数据

在导航菜单栏中依次点击“我的内容”“我的数据”选项卡,然后点击[上传数据]按钮。 在弹出的对话框中选择已准备好的zip压缩包,数据名称可根据需要修改。

勾选“已阅读并同意《超图在线GIS平台使用协议》”后,点击[确定]按钮上传。

3. 将已上传的数据为发布为REST地图服务

上传数据完成后可以在数据列表中查看,为了数据可以支持与超图云地图的叠加,这里需要将数据发布为地图服务。 点击操作按钮中的第一个,并在弹出的对话框中选择发布为 REST地图服务

4. 查看已发布的REST地图服务

REST地图发布完成后,在操作栏中点击第一个按钮[查看],查看已发布的服务地址

在弹出的页面中,可以查看到已发布的REST的服务地址为:

以在iDesktop中配置的京津地区土地利用现状图为例(示意地址) :

www.supermapol.com/iserver/services/5uvy0vh9/rest/maps/京津地区土地利用现状图

最后,记录已发布的REST地图服务地址,待在SuperMap Online在线制图中使用。

在SuperMap Online 中在线制图

1. 打开在线制图编辑器

继续在上一个页面中,切换选项卡到[我的地图],然后点击绿色的按钮[创建地图]。

2. 在编辑器中创建底图图层

在地图编辑器中,切换到[底图]选项卡,并选择[超图云地图],之后可以看到右侧的地图编辑区,已成功显示超图云地图。

3. 在图层管理器中添加Web图层

接下来,找到之前保存的REST地图服务地址,并尝试将它叠加在超图云地图上:点击[图层]选项卡,点击“添加图层”按钮,选择[添加Web图层]。

4. 添加REST地图服务

在弹出的对话框中输入之前保存的REST地图服务地址并点击[确定],完成图层添加,即可在右侧的地图浏览窗口中看到图层叠加效果。

5. 保存地图

最后,点击保存按钮,设置地图的名称、范围等属性参数,完成在线地图的配置

6. 查看已保存的地图

打开SuperMap Online 主页,切换到[我的内容]页面,打开[我的地图]选项卡,可以浏览到在上一步中保存的地图

使用SuperMap Online API在项目中调用地图

1. 申请开发授权

在项目中调用已配置的地图,需要先申请开发授权,以下简称Key。

打开SuperMap Online 主页,切换到[我的内容]页面,打开[我的密钥]选项卡,并填写以下内容:

  • 应用名称:此处填写应用名称,注意不要输入非法字符。
  • 应用类型:此处以[服务请求]为例,是常用的一种调用方法,此外还有站点访问和移动端两类请求。
  • 服务:此处选择除基础服务外的服务类型。
  • 我的服务:选择已发布的发布,这里选择在之前发布的服务,即已发布的[京津地区土地利用现状图]服务

点击[确定]按钮。

2. 查看已申请的key

在导航栏中,返回[我的密钥]列表,可以看到刚刚申请的应用秘钥:

3. 创建项目,调用地图

创建一个空的html文件,输入以下代码,注意替换已申请的key:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>京津地区土地利用现状图</title>
<script src='http://www.supermapol.com/demos/DynamicProjection/libs/SuperMap.Include.js'></script>
<script type="text/javascript">
var map, layerBaseMap,layerJingjing;
var urlJingjin="http://itest.supermapol.com/iserver/services/ozx4t0pi/rest/maps/京津地区土地利用现状图";
SuperMap.Credential.CREDENTIAL = new SuperMap.Credential("替换为你申请的key", "key");

function init(){
    map = new SuperMap.Map("map",{controls: [
    new SuperMap.Control.ScaleLine(),
    new SuperMap.Control.Zoom(),
    new SuperMap.Control.MousePosition(),
    new SuperMap.Control.Navigation({
        dragPanOptions: {
        enableKinetic: true
        }})], allOverlays: true});
        layerBaseMap = new SuperMap.Layer.CloudLayer();
        layerJingjing = new SuperMap.Layer.TiledDynamicRESTLayer("京津地区土地利用现状图", urlJingjin, {transparent: true, cacheEnabled: true},{projection:"EPSG:3857"});
        layerJingjing.events.on({"layerInitialized": addLayer});
        layerJingjing.setOpacity(0.6);
}

function addLayer(){
    map.addLayers([layerBaseMap,layerJingjing]);
    map.setCenter(new SuperMap.LonLat(12957390.81712, 4855580.62445), 8);
 }
</script>
</head>
<body onload="init()">
</div>
<div id="map"></div>
</body>
</html>

4. 保存html文件,在浏览器中浏览地图

保存以上代码为html文件,用浏览器打开查看,即可看到以保存的[京津地区土地利用现状图]。