我的GIS 作者：林国佳
一：开发工具与关键技术
１．开发工具 ：Visual Stuaio 2015 superMap iDesktop 9D
２．关键技术：Supermap iserver
功能实现（图层管理）
图１
点击图1 勾上医院前的按钮 地图显示医院的位置 如图2，
图２
点击医院图标，弹出医院信息 如图3
代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>查询交互</title>
<style type="text/css">
body {
margin: 0;
overflow: hidden;
background: #fff;
}
#MYmap {
position: relative;
height: 520px;
border: 1px solid #3473b7;
}
#toolbar {
position: relative;
padding-top: 5px;
padding-bottom: 10px;
}
</style>
<link href="~/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="~/bootstrap/css/bootstrap-responsive.css" rel="stylesheet" />
<script src="~/SuperMap/libs/SuperMap.Include.js"></script>
@*<script src="~/bootstrap/js/jquery.js"></script>*@
<script type="text/javascript">
var MYmap, layer, WDLA, MYtempLayer, MYdrag, MYdelIndex = 0, editEnable = false,
//设置图层样式
WDstyle = {
externalGraphic: "/SuperMap/images/markerbig.png",//externalGraphic用于渲染点的外部图形url。
graphicWidth: 13,//外部图表的像素宽度。
graphicHeight: 16,//外部图表的像素高度。
name: "town"
},transformControl,
//host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host,
url1 = "http://127.0.0.1:8090/iserver/services/map-zengcheng/rest/maps/增城区_region@ZengCheng";
function init() {
//加载map控件
MYmap = new SuperMap.Map("MYmap", {
controls: [
new SuperMap.Control.LayerSwitcher(),//SuperMap.Control.LayerSwitcher 图层选择控件类。
new SuperMap.Control.ScaleLine(),//比例尺控件
new SuperMap.Control.Zoom(),//Zoom
new SuperMap.Control.Navigation({//此控件处理伴随鼠标事件
dragPanOptions: {//传给 DragPan 控件的属性
enableKinetic: true///设置是否使用拖拽动画。默认为false，不使用动画。
}
})], units: "m"//地图的单位。默认是’degrees’。可选值为’degrees’(或者 ‘dd’), ‘m’,’ft’,’km’,’mi’,’inches’。
});
//初始化图层
layer = new SuperMap.Layer.TiledDynamicRESTLayer("China400", url1, { transparent: true, cacheEnabled: true }, { maxResolution: "auto" });
layer.events.on({ "layerInitialized": addLayer });
//初始化Vector图层
WDLA = new SuperMap.Layer.Vector("医院", { renderers: ["Canvas2"] });//renderers渲染//Vector 创建一个矢量图层。
//给在vector图层上所选择的要素初始化
//SelectFeature要素选择控件，该控件实现在指定的的图层上通过鼠标单击和悬浮选择矢量要素。
//onSelect地物被选中时可以调用该方法，完成用户指定的任务。要求用户定义具体方法， 该方法接收当前选中要素作为参数。
//onFeatureSelect 方法名
// 当地物被取消选择时可以调用该方法，完成用户指定的任务。要求用户定义具体方法， 该方法接收地物要素作为参数。
//onFeatureUnselect 方法名
//repeat是否重复循环播放。默认为true。
select = new SuperMap.Control.SelectFeature(WDLA, { onSelect: onFeatureSelect, onUnselect: onFeatureUnselect, repeat: true });
//添加
MYmap.addControl(select);
}
//要素被选中时调用此函数
function onFeatureSelect(MYfeature) {
selectedFeature = MYfeature;
//popup创建弹窗。在地图上可以打开或关闭，通常情况下点击一个 icon 打开弹窗， 弹窗直接加载到map上，
//不需要创建图层，可用 SuperMap.Map.addPopup 方法在地图上添加使用。 例如:
if (MYfeature.popup) {
MYfeature.popup.show();//show显示弹窗。覆盖父类方法，显示弹窗。
return;
}
var contentHTML = "<div style='font-size:.8em; opacity: 0.8; overflow-y:hidden;'>" +
"<span style='font-weight: bold; font-size: 18px;'>详细信息</span><br>";
contentHTML += "医院名称：" + MYfeature.attributes["NAME"] + "<br>";
contentHTML += "医院地址：" + MYfeature.attributes["ADDRESS"] + "<br>";
contentHTML += "医院电话：" + MYfeature.attributes["TELEPHONE"] + "</div>";
//popup初始化一个弹出窗口，当某个地图要素被选中时会弹出此窗口，用来显示选中地图要素的属性信息
MYpopup = new SuperMap.Popup.FramedCloud("chicken",//FranedCloud 具有指向和边框的浮动弹窗。
//getBounds获得几何图形的边界。如果没有设置边界，可通过计算获得。//getCenterLonLat获取地理格式的范围中心点
MYfeature.geometry.getBounds().getCenterLonLat(),
null,
contentHTML,
null,
true,
null,
true);
MYfeature.popup = MYpopup;
//创建
MYmap.addPopup(MYpopup);
}
//关闭弹出窗口
function onPopupClose(evt) {
}
//清除要素时调用此函数
function onFeatureUnselect(MYfeature) {
MYmap.removePopup(MYfeature.popup);
MYfeature.popup.destroy();
MYfeature.popup = null;
}
//添加图层
function addLayer() {
var lonlat = layer.maxExtent.getCenterLonLat();//getCenterLonLat获取地理格式的范围中心点
lon = lonlat.lon;
lat = lonlat.lat;
MYmap.addLayers([layer, WDLA]);
MYmap.setCenter(new SuperMap.LonLat(lon, lat), 4);
MYmap.addControl(new SuperMap.Control.MousePosition());
}
//SQL查询
function queryBySQL() {
WDLA.removeAllFeatures();
MYdelIndex = 0;
// 查询中国的部分县。
var queryParam, queryBySQLParams, queryBySQLService;
// 初始化查询参数
queryParam = new SuperMap.REST.FilterParameter({//FilterParameter查询过滤条件参数类。 该类用于设置查询数据集的查询过滤参数。
name: "P15医疗服务_point@ZengCheng",//图层的名称
attributeFilter: "TYPE =7200 or TYPE =7280"//查询参数
}),
// 初始化sql查询参数
queryBySQLParams = new SuperMap.REST.QueryBySQLParameters({//QueryBySQLParameters SQL 查询参数类。 该类用于设置 SQL 查询的相关参数。
queryParams: [queryParam]//查询过滤条件参数数组。
}),
// SQL查询服务
//QueryBySQLService SQL 查询服务类。 在一个或多个指定的图层上查询符合 SQL 条件的空间地物信息。
queryBySQLService = new SuperMap.REST.QueryBySQLService(url1, {
//eventListeners监听器对象，在构造函数中设置此参数（可选），对 EditFeaturesService 支持的两个事件 processCompleted 、processFailed 进行监听，相当于调用 SuperMap.Events.on(eventListeners)。
//
eventListeners: { "processCompleted": processCompleted, "processFailed": processFailed }
});
queryBySQLService.processAsync(queryBySQLParams);
}
//SQL查询(县)成功时触发此事件
function processCompleted(queryEventArgs) {
//alert(12);
var i, j, MYfeature,
result = queryEventArgs.result;
features = [];
if (result && result.recordsets) {
for (i = 0; i < result.recordsets.length; i++) {
if (result.recordsets[i].features) {
for (j = 0; j < result.recordsets[i].features.length; j++) {
MYfeature = result.recordsets[i].features[j];
MYfeature.style = WDstyle;
features.push(MYfeature);
}
}
}
}
WDLA.addFeatures(features);
select.activate();
}
//SQL查询(县)失败时出发的事件
function processFailed(e) {
//alert(123)
alert(e.error.errorMsg);
}
//清除全部要素
function clearFeatures() {
if (WDLA.selectedFeatures.length > 0) {
MYmap.removePopup(WDLA.selectedFeatures[0].MYopup);
}
WDLA.removeAllFeatures();
}
function sdf() {
//alert(document.getElementById("SuperMap.Control.LayerSwitcher_5_input_Vector Layer").checked)
if (document.getElementById("few").checked) {
queryBySQL();
}
else {
clearFeatures();
}
}
</script>
</head>
<body "init()">
<div id="toolbar" >
<input type="checkbox" value="few" id="few" onclick="sdf()" name="daf"/>
<span>医院</span>
</div>
<div id="MYmap"></div>
</body>
</html>
开发总结
GIS，全称是Geographic Information System，地理信息系统。对我而言就是采集空间有用数据来制作地图的系统 。GIS以地理空间数据基础，由计算机系统、地理数据和用户组成。通过对空间相关是数据进行采集、管理、操作、分析、显示并采用地理模型分析方法，提供各种空间的动态的地理信息，为地理研究和决策服务建立起计算机技术系统。
我一开始学GIS，对GIS的功能不是很了解，supermap iDesktop 9D和superMap iserver软件用的不流畅， 还有功能不会操作，导致花了很多时间去API和百度上去找，去看、去研究。经过一段时间的研究，我做出了上面很简陋的功能。经过研究我积累了一些经验， 通过学习和研究熟悉了软件的常用控件的添加与使用。让我对supermap iDesktop 9D和superMap iserver 有了一点了解，superMap是国产的GIS软件，由北京超图软件股份有限公司研发出来的一款地理信息系统—SuperMap GIS 。