GIS区域定位
GIS区域定位
一、功能实现
区域定位主要包括11个定位地点,点击地图可以实现定位到点击的区域
区域定位的实现界面:见下图。
点击上图中的龙城街道可以定位到龙城街道区域的位置,如下图
点击上图中的大鹏镇街道可以定位到大鹏镇街道区域的位置,如下图
二、相关操作
要定位到某一区域,首先要在SuperMap iDesktop 8C中把这一区域进行切割、编辑节点、添加节点,如下图
然后添加该区域的x,y坐标到数据库中如下图
三、经典代码
<li id="qydw" class="libox">
<p>所选地区 : <i onclick="clickSelectMap(1)">龙岗区</i></p>
<p>
<i id="" onclick="clickSelectMap(2)">南澳街道</i>
<i id="" onclick="clickSelectMap(4)">大鹏镇街道</i>
<i id="" onclick="clickSelectMap(6)">葵涌街道</i>
<i id="" onclick="clickSelectMap(8)">坂田街道</i>
</p>
<p>
<i id="" onclick="clickSelectMap(9)">横岗街道</i>
<i id="" onclick="clickSelectMap(10)">龙城街道</i>
<i id="" onclick="clickSelectMap(12)">坪山街道</i>
<i id="" onclick="clickSelectMap(14)">坑梓街道</i>
</p>
<p>
<i id="" onclick="clickSelectMap(15)">龙岗镇</i>
<i id="" onclick="clickSelectMap(16)">坪地街道</i>
</p>
</li>
//查询事件
function clickSelectMap(Id) {
var queryParam = [], queryBySQLParams, queryBySQLService;
villagesLayer.setVisibility(true);
//查询子网格
queryParam.push(new SuperMap.REST.FilterParameter({
name: "乡镇区域[email protected]_Data",//查询数据集名称或者图层名称,根据实际的查询对象而定,必设属性
attributeFilter: "SmID=" + Id,//属性过滤条件 相当于 SQL 语句中的 WHERE 子句,
}));
//SQL 查询参数类。 该类用于设置 SQL 查询的相关参数。
queryBySQLParams = new SuperMap.REST.QueryBySQLParameters({
queryParams: queryParam//查询过滤条件参数数组
});
//SQL 查询服务类。 在一个或多个指定的图层上查询符合 SQL 条件的空间地物信息。
queryBySQLService = new SuperMap.REST.QueryBySQLService(url, {//url 服务的访问地址
eventListeners: { "processCompleted": processCompleted_PG }
});
//传递到服务端
queryBySQLService.processAsync(queryBySQLParams);
}
//查询成功调用
function processCompleted_PG(queryEventArgs) {
//声明字段
var i, j, feature, bounds, N = [], S = [], W = [], E = [],
result = queryEventArgs.result;//获取服务器传回来的数据
villagesLayer.removeAllFeatures();//清除上一次查询
map.addLayer(villagesLayer);
var features = [];
//判断是否有数据
if (result.currentCount > 0) {
if (result && result.recordsets) {//判断查询的查询结果记录集数组是否为空
for (i = 0; i < result.recordsets.length; i++) {//循环记录集数组
//features===用于存放矢量要素
if (result.recordsets[i].features) {//判断记录集数组的矢量要素是否为空
//如果记录集数组的矢量要素不为空,则又循环 记录集数组的矢量要素
for (j = 0; j < result.recordsets[i].features.length; j++) {
feature = result.recordsets[i].features[j];//获取记录集数组的矢量要素
//判断显示面或点
var smID = parseInt(feature.data.SmID);
feature.smID = smID;
if (smID != "") {//清空
//社区网格
feature.style = {
strokeColor: 'Orange',//边颜色
strokeWidth: 1,//边宽度
strokeDashstyle: 'solid',//边类型,虚线
fillColor: 'Orange',//填充颜色
fillOpacity: 0.15,//透明度
label: feature.data.Name,
fontColor: 'red',
fontOpacity: "1",
fontSize: '10px',
fontWeight: 700
};
villagesLayer.addFeatures(feature);//给这个图层添加features。也就是把查询结果显示出来
} else {
}
bounds = feature.geometry.bounds;
if (bounds != null) {
if (bounds.top != null && Boolean(bounds.top) == true) {
N.push(Number(bounds.top));
}
if (bounds.bottom != null && Boolean(bounds.bottom) == true) {
S.push(Number(bounds.bottom));
}
if (bounds.left != null && Boolean(bounds.left) == true) {
W.push(Number(bounds.left));
}
if (bounds.right != null && Boolean(bounds.right) == true) {
E.push(Number(bounds.right));
}
}
}
}
}
}
if (W.length > 0 && S.length > 0 && E.length > 0 && N.length > 0) {
var bounds = new SuperMap.Bounds(
Math.min.apply(null, W),//最小的水平坐标系。
Math.min.apply(null, S),//最小的垂直坐标系。
Math.max.apply(null, E),//最大的水平坐标系。
Math.max.apply(null, N) //最大的垂直坐标系。
);
map.zoomToExtent(bounds);//缩放到指定范围,重新定位中心点。
}
} else {
map.removeLayer(villagesLayer);//清除图层
map.setCenter(new SuperMap.LonLat(112.88, 23.2));//重新定位中心点。
}
}