《佛山顺德慢性病地理信息系统》项目研发阶段性总结
模块功能:登录、图层管理器、区域定位、工具箱(面积量算、距离量算、几何查询)、查询搜索、周边分析、个人资料
一、 功能实现
1.登录(输入账号、密码登录后系统会判断当前登录用户的类型而设置权限)
2. 图层管理器
勾选相应的图层,地图中就会出现相应的图标,点击图标显示信息。
- 区域定位(只是定位点)
- 工具箱
面积量算
点击面积小图标,然后在地图上任意地方点击,起点,然后随着这个点,围绕起来点击,就可以点出一个面的情况,双击鼠标左键结束。自动测量出面积。
距离量算
点击距离小图标,鼠标箭头加了一个小圆圈,在地图上任意点一下鼠标左键,就可以定起点,然后拖动鼠标到其他一点,再点击就可以再一个点。直到双击鼠标 就可以结束,并且自动测距离,展示以米为单位的距离。
几何查询
在地图上画矩形、圆、多边形,查出区域中的医院、药店、社康。
-
查询搜索
在输入框中输入地址进行模糊查询,在结果信息中点击还可以定位。 -
周边分析
通过选择定位点,以点为圆心设定范围内可查出,你选择的查询目标。 -
个人资料
个人资料中输入框为灰色的输入框无法修改,这里可以修改个人资料和密码
二、 经典代码
这是地图加载方法
//————————————————地图加载————————————————//
function init() {
//定义layer图层,获取图层服务地址
layer = new SuperMap.Layer.TiledDynamicRESTLayer("行政区域图", url1, { transparent: true, cacheEnabled: true, units: 'm' }, { maxResolution: "auto" });
//为图层初始化完毕添加layerInitialized事件
layer.events.on({ "layerInitialized": addLayer });//SuperMap iClient for JavaScript提升地图浏览性能
//创建地图控件
map = new SuperMap.Map("map", {
controls: [
new SuperMap.Control.LayerSwitcher(),
new SuperMap.Control.PanZoomBar(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.MousePosition(),
new SuperMap.Control.Navigation({//添加导航控件到map
dragPanOptions: {
enableKinetic: true//拖拽动画
}
})]
});
}
//————————————————定义addLayer函数,触发图层初始化时会调用此函数————————————————//
function addLayer() {
map.addLayers([layer, markers, vectorLayer, HospitalMarkers, DrugstoreMarkers, HealthMarkers]);
var lonlat = layer.maxExtent.getCenterLonLat();
lon = lonlat.lon;
lat = lonlat.lat;
map.setCenter(new SuperMap.LonLat(lon, lat), 3);
}
三、 开发总结
做这个系统时,刚开始还是一窍不通,到后来的慢慢熟悉SuperMap iClient for JavaScript和示范程序中,自行研究,学习本来就是一个自主研究的过程,没有什么解决不了的问题,代码是具有丰富的创造性。
备注:需要详细代码的可以留言。