dragFeature触发事件后有个onStart属性,用于纪录当前原始坐标点信息,只需要将这个信息进行保存即可。
可以访问 http://iclient.supermapol.com/examples/classic/editor.html#map_4326Map
点击源码,贴入下面的代码。
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title data-i18n="resources.title_dragFeature"></title>
<style type="text/css">
.editPane {
position: absolute;
left: 50px;
top: 10px;
text-align: center;
background: #FFF;
z-index: 1000;
}
</style>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div class='panel panel-primary editPane' id='editPane' style="z-index: 99999">
<div class='panel-heading'>
<h5 class='panel-title text-center' data-i18n="resources.text_dragFeature"></h5>
</div>
<div class='panel-body' id='params'>
<p></p>
<div align='right' class='button-group'>
<input type='button' id='btn1' class='btn btn-primary' data-i18n="[value]resources.text_input_value_dragFea" onclick="activateDragFeature()"/>
<input type='button' id='btn2' class='btn btn-primary' data-i18n="[value]resources.text_input_value_notDrag" onclick="deactivateDragFeature()"/>
</div>
</div>
</div>
<div id="map" style="margin:0 auto;width: 100%;height: 100%"></div>
<script type="text/javascript" include="bootstrap" src="../js/include-web.js"></script>
<script type="text/javascript" exclude="iclient-classic" src="../../dist/include-classic.js"></script>
<script type="text/javascript">
var host = window.isLocal ? window.server : "http://support.supermap.com.cn:8090";
var map, layer, vectorLayer, dragFeature;
url = host + "/iserver/services/map-world/rest/maps/World";
//新建矢量图层
vectorLayer = new SuperMap.Layer.Vector("vectorlayer");
addData();
dragFeature = new SuperMap.Control.DragFeature(vectorLayer);
//移动触发事件
dragFeature.onStart = startFunction;
//定义layer图层,TiledDynamicRESTLayer:分块动态 REST 图层
layer = new SuperMap.Layer.TiledDynamicRESTLayer("World", url, {
transparent: true,
cacheEnabled: true
}, {maxResolution: "auto"});
//为图层初始化完毕添加addLayer()事件
layer.events.on({"layerInitialized": addLayer});
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
}
}),
dragFeature]
});
function addLayer() {
map.addLayers([layer, vectorLayer]);
map.setCenter(new SuperMap.LonLat(0, 0), 1);
}
function addData() {
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);
}
vectorLayer.addFeatures(point_features);
}
//自己定义的方法
function startFunction(feature,pixel){
var fea= feature;
var geometry = new SuperMap.Geometry.Point(fea.geometry.x,fea.geometry.y);
var style = {
strokeColor:"#339933",
strokeOpacity:1,
strokeWidth:3,
pointRadius:6
}
var pointFeature = new SuperMap.Feature.Vector(geometry,null,style);
vectorLayer.addFeatures(pointFeature);
var position = pixel;
console.log(fea);
}
//激活拖拽要素控件
function activateDragFeature() {
dragFeature.activate();
}
//注销拖拽要素控件
function deactivateDragFeature() {
dragFeature.deactivate();
}
</script>
</body>
</html>