地图要素修改
2016-07-28 21:35
239 查看
第一步：启动iserver
第二步：启动web服务
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>要素编辑</title>
<style type="text/css">
html,body {
margin: 0;
overflow: hidden;
background: #fff;
height:100%;
}
#map {
position: relative;
height: calc(100% - 33px);
border: 1px solid #3473b7;
}
#toolbar {
position: relative;
height: 33px;
padding-top: 5;
}
</style>
<script src='libs/SuperMap.Include.js'></script>
<script type="text/javascript">
var map, local, layer, vector, modifyFeature, modifyfeature, selectFeature, snapState = true, dataAdded = false, snap01;
style = {
strokeColor : "red",
strokeWidth : 10,
pointerEvents : "visiblePainted",
fillColor : "red",
fillOpacity : 0.8
};
url = "http://localhost:8090/iserver/services/map-world/rest/maps/World";
function init() {
//新建矢量图层
vector = new SuperMap.Layer.Vector("vectorLayer");
//创建捕捉对象，第一个参数指的是需要进行捕捉的要素图层，后面两个参数分别是点要素和线要素的捕捉容限，第四个参数是附加参数
snap01 = new SuperMap.Snap([ vector ], 4, 2, {
actived : true
});
//矢量要素编辑控件
modifyFeature = new SuperMap.Control.ModifyFeature(vector);
modifyFeature.snap = snap01;
//定义layer图层，TiledDynamicRESTLayer：分块动态 REST 图层
layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
transparent : true,
cacheEnabled : true
}, {
maxResolution : "auto"
});
//为图层初始化完毕添加addLayer()事件
layer.events.on({
"layerInitialized" : addLayer
}
4000
);
map = new SuperMap.Map("map", {
controls : [ new SuperMap.Control.LayerSwitcher(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.Zoom(),
new SuperMap.Control.Navigation({
dragPanOptions : {
enableKinetic : true
}
}), modifyFeature ]
});
vector.events.on({"featuremodified":featureStart});
vector.events.on({"afterfeaturemodified": drawCompleted});
addData();
}
function featureStart(){
alert("kaishibianji");
}
//画线
function drawCompleted(drawGeometryArgs) {
alert("编辑完成");
var featuretype=drawGeometryArgs.feature.geometry.componentTypes[0];
var temppoints=[];
points=drawGeometryArgs.feature.geometry.components[0].components;
for(var i=0;i<points.length;i++){
var point={};
point.y=points[i].y;
point.x=points[i].x;
temppoints[i]=point;
}
debugger;
var centerpoint=drawGeometryArgs.feature.geometry.getCentroid();
var geometryObj={};
geometryObj.featuretype=featuretype;
geometryObj.points=temppoints;
geometryObj.centerpoint=centerpoint;
// for(var i=0;i<points.length;i++){
pickpoints.push(geometryObj);
// }
// var centerpoint=drawGeometryArgs.feature.geometry.getCentroid();
console.info(pickpoints);
//measureJL(drawGeometryArgs);
}
function addLayer() {
map.addLayers([ layer, vector ]);
map.setCenter(new SuperMap.LonLat(0, 0), 0);
}
function edit_feature() {
deactiveAll();
modifyFeature.activate();
snap01.on();
snapState = true;
}
function deactivate_snap_all() {
snapState = false;
snap01.off();
}
function activate_snap_all() {
snapState = true;
snap01.on();
}
function switch_snap() {
snapState ? deactivate_snap_all() : activate_snap_all();
}
function deactiveAll() {
modifyFeature.deactivate();
deactivate_snap_all();
}
//移除图层要素
function clearFeatures() {
deactiveAll();
dataAdded = false;
vector.removeAllFeatures();
}
function addData() {
if (!dataAdded) {
//点数据
var point_data = [ [ -55, 34 ], [ -90, -45 ], [ 44, -50 ],
[ 100, 33 ], [ 94, 57 ] ];
var point_features = [];
for ( var i = 0, len = point_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(point_data[i][0],
point_data[i][1]);
var feature = new SuperMap.Feature.Vector(point);
point_features.push(feature);
}
//线数据{"x":120.30131839949,"y":32.365385417042},{"x":120.87260746211,"y":32.002836588837}
var line_data = [ [ 120.30131839949, 32.365385417042 ], [ 120.87260746211,32.002836588837 ]];
var points = [];
for ( var i = 0, len = line_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(line_data[i][0],
line_data[i][1]);
points.push(point);
}
var line = new SuperMap.Geometry.LineString(points);
var line_feature = new SuperMap.Feature.Vector(line);
//面数据
var polygon_data = [ [ -16, 30 ], [ -16, 0 ], [ 50, 0 ], [ 50, 30 ] ];
var points = [];
for ( var i = 0, len = polygon_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(polygon_data[i][0],
polygon_data[i][1]);
points.push(point);
}
var linearRing = new SuperMap.Geometry.LinearRing(points);
var polygon = new SuperMap.Geometry.Polygon([ linearRing ]);
var polygon_feature = new SuperMap.Feature.Vector(polygon);
point_features.push(line_feature);
point_features.push(polygon_feature);
vector.addFeatures(point_features);
dataAdded = true;
} else {
alert("数据已加载。");
}
edit_feature();
}
</script>
</head>
<body onload="init()">
<div id="toolbar">
<input type="button" value="切换捕捉" onclick="switch_snap()" /> <input
type="button" value="加载数据" onclick="addData()" /> <input
type="button" value="清除" onclick="clearFeatures()" />
</div>
<div id="map"></div>
</body>
</html>
第二步：启动web服务
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>要素编辑</title>
<style type="text/css">
html,body {
margin: 0;
overflow: hidden;
background: #fff;
height:100%;
}
#map {
position: relative;
height: calc(100% - 33px);
border: 1px solid #3473b7;
}
#toolbar {
position: relative;
height: 33px;
padding-top: 5;
}
</style>
<script src='libs/SuperMap.Include.js'></script>
<script type="text/javascript">
var map, local, layer, vector, modifyFeature, modifyfeature, selectFeature, snapState = true, dataAdded = false, snap01;
style = {
strokeColor : "red",
strokeWidth : 10,
pointerEvents : "visiblePainted",
fillColor : "red",
fillOpacity : 0.8
};
url = "http://localhost:8090/iserver/services/map-world/rest/maps/World";
function init() {
//新建矢量图层
vector = new SuperMap.Layer.Vector("vectorLayer");
//创建捕捉对象，第一个参数指的是需要进行捕捉的要素图层，后面两个参数分别是点要素和线要素的捕捉容限，第四个参数是附加参数
snap01 = new SuperMap.Snap([ vector ], 4, 2, {
actived : true
});
//矢量要素编辑控件
modifyFeature = new SuperMap.Control.ModifyFeature(vector);
modifyFeature.snap = snap01;
//定义layer图层，TiledDynamicRESTLayer：分块动态 REST 图层
layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
transparent : true,
cacheEnabled : true
}, {
maxResolution : "auto"
});
//为图层初始化完毕添加addLayer()事件
layer.events.on({
"layerInitialized" : addLayer
}
4000
);
map = new SuperMap.Map("map", {
controls : [ new SuperMap.Control.LayerSwitcher(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.Zoom(),
new SuperMap.Control.Navigation({
dragPanOptions : {
enableKinetic : true
}
}), modifyFeature ]
});
vector.events.on({"featuremodified":featureStart});
vector.events.on({"afterfeaturemodified": drawCompleted});
addData();
}
function featureStart(){
alert("kaishibianji");
}
//画线
function drawCompleted(drawGeometryArgs) {
alert("编辑完成");
var featuretype=drawGeometryArgs.feature.geometry.componentTypes[0];
var temppoints=[];
points=drawGeometryArgs.feature.geometry.components[0].components;
for(var i=0;i<points.length;i++){
var point={};
point.y=points[i].y;
point.x=points[i].x;
temppoints[i]=point;
}
debugger;
var centerpoint=drawGeometryArgs.feature.geometry.getCentroid();
var geometryObj={};
geometryObj.featuretype=featuretype;
geometryObj.points=temppoints;
geometryObj.centerpoint=centerpoint;
// for(var i=0;i<points.length;i++){
pickpoints.push(geometryObj);
// }
// var centerpoint=drawGeometryArgs.feature.geometry.getCentroid();
console.info(pickpoints);
//measureJL(drawGeometryArgs);
}
function addLayer() {
map.addLayers([ layer, vector ]);
map.setCenter(new SuperMap.LonLat(0, 0), 0);
}
function edit_feature() {
deactiveAll();
modifyFeature.activate();
snap01.on();
snapState = true;
}
function deactivate_snap_all() {
snapState = false;
snap01.off();
}
function activate_snap_all() {
snapState = true;
snap01.on();
}
function switch_snap() {
snapState ? deactivate_snap_all() : activate_snap_all();
}
function deactiveAll() {
modifyFeature.deactivate();
deactivate_snap_all();
}
//移除图层要素
function clearFeatures() {
deactiveAll();
dataAdded = false;
vector.removeAllFeatures();
}
function addData() {
if (!dataAdded) {
//点数据
var point_data = [ [ -55, 34 ], [ -90, -45 ], [ 44, -50 ],
[ 100, 33 ], [ 94, 57 ] ];
var point_features = [];
for ( var i = 0, len = point_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(point_data[i][0],
point_data[i][1]);
var feature = new SuperMap.Feature.Vector(point);
point_features.push(feature);
}
//线数据{"x":120.30131839949,"y":32.365385417042},{"x":120.87260746211,"y":32.002836588837}
var line_data = [ [ 120.30131839949, 32.365385417042 ], [ 120.87260746211,32.002836588837 ]];
var points = [];
for ( var i = 0, len = line_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(line_data[i][0],
line_data[i][1]);
points.push(point);
}
var line = new SuperMap.Geometry.LineString(points);
var line_feature = new SuperMap.Feature.Vector(line);
//面数据
var polygon_data = [ [ -16, 30 ], [ -16, 0 ], [ 50, 0 ], [ 50, 30 ] ];
var points = [];
for ( var i = 0, len = polygon_data.length; i < len; i++) {
var point = new SuperMap.Geometry.Point(polygon_data[i][0],
polygon_data[i][1]);
points.push(point);
}
var linearRing = new SuperMap.Geometry.LinearRing(points);
var polygon = new SuperMap.Geometry.Polygon([ linearRing ]);
var polygon_feature = new SuperMap.Feature.Vector(polygon);
point_features.push(line_feature);
point_features.push(polygon_feature);
vector.addFeatures(point_features);
dataAdded = true;
} else {
alert("数据已加载。");
}
edit_feature();
}
</script>
</head>
<body onload="init()">
<div id="toolbar">
<input type="button" value="切换捕捉" onclick="switch_snap()" /> <input
type="button" value="加载数据" onclick="addData()" /> <input
type="button" value="清除" onclick="clearFeatures()" />
</div>
<div id="map"></div>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 全局的Context实现
- Git学习（3）
- poj3666 Making the Grade
- HDD is Outdated Technology（标记有技巧）
- java算法——分解质因数
- thinkphp介绍及访问方式
- jQuery对象与DOM对象
- Svn与Git的区别
- D3.js 之面包圈图
- Android屏幕适配全攻略(最权威的官方适配指导)
- HDU 1213
- android异常收集－ java.lang.NumberFormatException
- 商城项目总结（一）
- Linux基础系列4（ls，cp命令详解）
- android相关素材以及网站
- Html与CSS快速入门03-CSS基础应用
- 层叠上下文(The stacking context)
- HelloWorld
- Linux的文件管理（一）
- java算法——打印100以内的素数