版权声明：转载来源 《张益达的博客》 https://blog.csdn.net/weixin_44538399 https://blog.csdn.net/weixin_44538399/article/details/86540438
功能实现
1、工具栏
点击下方工具栏，里面分别是测距、侧面积、地图截图、清除、搜索定位五个功能
测距：绘制一条直线，测量两点间的直线距离。
侧面积：绘制一个几何图形，测量该区域的面积。
截图：点击保存可保存当前所截取的内容为图片。
清除：关闭所有图层、弹窗、模态窗体等。
搜索定位：输入地址进行模糊查询，点击定位会弹出提示框提示地址信息。
2、管辖区域定位
点击右侧管辖区域 
点击某个区域，然后地图会定位到该区域
3、事故确认上报
当有新事故上报，在警员登记后，就会在地图上显示出来
点击新事故图标
周边查询可根据条件查询出事故点指定范围内的药店、社康和派出所
可以通过搜索警点来重新确定事故点或者进行事故确认上报
确认事故地址后，该事故状态改变为“未处理”，然后可对其进行派遣医护人员进行急救
经典代码
改变浏览器鼠标右键默认行为
//改变浏览器鼠标右键默认行为
document.getElementById("map").oncontextmenu=function(e){
return false;
}
//右键取消绘图
document.getElementById("map").onmousedown = function (e) {
if (e.button == 2) {
if (infowinonMessage) {
try { }
catch (e) {
clearFeatures();
}
} else {
clearFeatures();
}
}
}
从数据库查询出医院列表
function HospitalSitePoint()//定位医院
{
$.post("/Main/SelectHospitalSite", function (data) {
if (data.length > 0) {
var HospitalSitesDataset = [];//微型消防站集
for (var i = 0; i < data.length; i++) {
HospitalSitesDataset.push(data[i].HospitalGISID);
}
var queryParam, queryBySQLParams, queryBySQLService;
queryParam = new SuperMap.REST.FilterParameter({
name: "P15医疗服务_point_1@FoShanChanCheng#2",
attributeFilter: "SmID in (" + HospitalSitesDataset + ")"
});
queryBySQLParams = new SuperMap.REST.QueryBySQLParameters({
queryParams: [queryParam]
});
queryBySQLService = new SuperMap.REST.QueryBySQLService(url, {
eventListeners: { "processCompleted": Showlandmark, "processFailed": processFailed }
});
queryBySQLService.processAsync(queryBySQLParams);
}
});
}
添加医院图标
//添加医院图标
function Showlandmark(obj)//在地图上显示站点地标
{
var result = obj.result;
var feature, x, y, LocalMrker, type = 0, index = 0,
size = new SuperMap.Size(25, 20),
offset = new SuperMap.Pixel(-(size.w / 2), -size.h);
//icon = new SuperMap.Icon("/SuperMap/theme/images/marker.png", size, offset);
if (result && result.recordsets) {
for (i = 0, recordsets = result.recordsets, len = recordsets.length; i < len; i++) {
if (recordsets[i].features) {
for (j = 0; j < recordsets[i].features.length; j++) {
feature = recordsets[i].features[j];
x = feature.geometry.x;
y = feature.geometry.y;
type = parseInt(feature.data.TYPE);
if (type == 7200)//判断站点类型
{
index = 1;
size = new SuperMap.Size(20, 20);
icon = new SuperMap.Icon("/Content/Image/logo.png", size, offset);
LocalMrker = new SuperMap.Marker(new SuperMap.LonLat(x, y), icon);
LocalMrker.id = index;
LocalMrker.typeID = type;
LocalMrker.name = feature.attributes.NAME;
LocalMrker.laction = feature.attributes.ADDRESS;
}
LocalMrker.GISID = feature.attributes.SmID;
LocalMrker.bool = false;
LocalMrker.events.on({
"click": OpenZhanDianMessagepopupss1,
"touchstart": OpenZhanDianMessagepopupss1, //假如要在移动端的浏览器也实现点击弹框，则在注册touch类事件
"scope": LocalMrker
});
if (index == 1)//根据不同的类型添加到不同的图层上
{
HospitalLayer.addMarker(LocalMrker);
}
}
}
}
}
}
开发总结
这是我第一次使用GIS，一开始接触GIS的时候，就感觉到一个字：“难”。什么图层、控件、监听、函数、方法等，完全不知道该如何使用，不知道实现这个功能需要什么方法。或者是实现了功能却根本不理解代码的意思。后来听老师讲，不要怕，就只用把它当作一个插件，像用bootstrap一样用就好了。
确实，把它当作一个插件来用就好了。有很多它自定义的方法不用我们刻意去死记硬背，只需要灵活运用，最重要的是iClient 帮助手册要翻的勤，多查多看多想多问，毕竟熟能生巧。
还有就是理解，有很多时候都是，明明功能都实现了，却还不知道代码的意思。后来慢慢的，学会把代码与身边的事物联系起来，把图层想象成纸，将绘图控件想象成笔等，就很好理解了。