supermap使用小结【分分快三计划】

作者:分分快三计划

//画圆
function drawGeometry1() {
    //先清除上次的来得结果
    clearFeatures();
    drawPolygon1.activate();
}

转自:

    var queryParam, queryByGeometryParameters, queryService;
    queryParam = new SuperMap.REST.FilterParameter({name: "T_CCP_LABEL_CORP2@nanjingmap"});
    queryByGeometryParameters = new SuperMap.REST.QueryByGeometryParameters({
        queryParams: [queryParam],
        geometry: drawGeometryArgs.feature.geometry,
        spatialQueryMode: SuperMap.REST.SpatialQueryMode.INTERSECT
    });
    queryService = new SuperMap.REST.QueryByGeometryService(url, {
        eventListeners: {
            "processCompleted": processCompleted,
            "processFailed": processFailed
        }
    });
    queryService.processAsync(queryByGeometryParameters);
}

/*********************拉宽并获得经纬度坐标系*********************************/
function boxExtend(){
var controlBox = new OpenLayers.Control();
OpenLayers.Util.extend(controlBox, {
draw: function () {
this.box = new OpenLayers.Handler.Box( controlBox,
{"done": this.notice},{ "persist": true},
{keyMask:OpenLayers.Handler.MOD_SHIFT });
this.box.activate();
},

//................................................画图查询................................................................
//画多边形
function drawGeometry2() {
    //先消弭上次的彰显结果
    clearFeatures();
    drawPolygon2.activate();
}

untiled = new OpenLayers.Layer.WMS( //单独图层
"省会", "",
{
height: '330',
width: '698',
layers: 'china:provice',
styles: '',
srs: 'EPSG:4610',
transparent: "true",
format: format
},
{singleTile: true, ratio: 1}
);
untiled.setVisibility(false); //设置为不显得
//var gmap = new OpenLayers.Layer.Google("Google Streets", {visibility: false});
/* var dm_wms = new OpenLayers.Layer.WMS( "点图层",
"",
{layers: "sf:bugsites,sf:archsites",
transparent: "true", format: "image/png"});*/

//......................................................................................................................

}
);

//..........................................删除....................................................................
//删除选中地物
function deleteSelectedFeature() {
    closeInfoWin2();
    if(ids === null || typeof ids === "undefined") return;
    var editFeatureParameter,
            editFeatureService;
    editFeatureParameter = new SuperMap.REST.EditFeaturesParameters({
        IDs: ids,
        editType: SuperMap.REST.EditType.DELETE
    });
    editFeatureService = new SuperMap.REST.EditFeaturesService(url2, {
        eventListeners: {
            "processCompleted": deleteFeaturesProcessCompleted,
            "processFailed": processFailed
        }
    });
    editFeatureService.processAsync(editFeatureParameter);
}
//删除选中地物
function deleteSelectedFeatureById(id) {
    closeInfoWin();
    if(id === null || typeof id === "undefined") return;
    var tempIds = [id];
    var editFeatureParameter,
            editFeatureService;
    editFeatureParameter = new SuperMap.REST.EditFeaturesParameters({
        IDs: tempIds,
        editType: SuperMap.REST.EditType.DELETE
    });
    editFeatureService = new SuperMap.REST.EditFeaturesService(url2, {
        eventListeners: {
            "processCompleted": deleteFeaturesProcessCompleted,
            "processFailed": processFailed
        }
    });
    editFeatureService.processAsync(editFeatureParameter);
}
//删除地物完毕
function deleteFeaturesProcessCompleted(editFeaturesEventArgs) {
    if(editFeaturesEventArgs.result.resourceInfo.succeed) {
        alert("删除成功");
        getCenterLonLat();
        getScale();
        //重新加载图层
        clearFeatures();
        map.removeLayer(layer,true);
        layer = new SuperMap.Layer.TiledDynamicRESTLayer("底图", url, {transparent: true, cacheEnabled: false, redirect: true},
                {scales:[1/5120000,1/2560000,1/1280000,1/640000,1/320000,1/160000,1/80000,1/40000,1/20000,1/10000,1/5000,1/2500]});
        layer.events.on({"layerInitialized":reloadLayer});
    }
    else {
        alert("删除战败");
    }
}
//....................................................................................................................
function reloadLayer(){
    map.addLayers([layer,vectorLayer,vectorLayer1, markerLayer,lineLayer, polygonLayer]);
    map.setCenter(new SuperMap.LonLat(centerLon, centerLat),presentScale);
}

/***********************鼠标点击,获取图层数据*******************************/
map.events.register('click', map, function (e) {
document.getElementById('nodelist').innerHTML = "Loading... please wait...";
var params = {
REQUEST: "GetFeatureInfo",
EXCEPTIONS: "application/vnd.ogc.se_xml",
BBOX: map.getExtent().toBBOX(),
X: e.xy.x,
Y: e.xy.y,
INFO_FORMAT: 'text/html',
QUERY_LAYERS: map.layers[0].params.LAYERS,
FEATURE_COUNT: 50,
Layers: 'ok',
Styles: '',
Srs: 'EPSG:4610',
WIDTH: map.size.w,
HEIGHT: map.size.h,
format: format};
OpenLayers.loadURL("", params, this, setHTML, setHTML);
OpenLayers.Event.stop(e);
});
/**************END*********鼠标点击,获取图层数据*******************************/

//清除当前增选的marker
function clearMarker() {
    var marker = this;
    marker.destroy();
}

</div>
<div id="wrapper">
<div id="location">经纬度坐标</div>
<div id="scale">
</div>
<div id="output">
</div>
</div>
<div id="xystr"></div>
<div id="nodelist">
<em>Click on the map to get feature info</em>
</div>
</body>
</html>

//..........................................展现当前比例尺....................................................................
function getScale(){
    var scale = map.getScale().toFixed(7);
    if(scale==(1/160000).toFixed(7)){
        presentScale = 5;
    }
    else if(scale==(1/80000).toFixed(7)){
        presentScale = 6;
    }
    else if(scale==(1/40000).toFixed(7)){
        presentScale = 7;
    }
    else if(scale==(1/20000).toFixed(7)){
        presentScale = 8;
    }
    else if(scale==(1/10000).toFixed(7)){
        presentScale = 9;
    }
    else if(scale==(1/5000).toFixed(7)){
        presentScale = 10;
    }
    else if(scale==(1/2500).toFixed(7)){
        presentScale = 11;
    }
    else if(scale==(1/320000).toFixed(7)){
        presentScale = 4;
    }
    else if(scale==(1/640000).toFixed(7)){
        presentScale = 3;
    }
    else if(scale==(1/1280000).toFixed(7)){
        presentScale = 2;
    }
    else if(scale==(1/2560000).toFixed(7)){
        presentScale = 1;
    }
    else if(scale==(1/5120000).toFixed(7)){
        presentScale = 0;
    }
    else{
        presentScale = 8;
    }
    document.getElementById("scale").value =presentScale;
}
function checkLeave()
{
    getCenterLonLat();
    getScale();
}
</script>
</head>
<body onload="init()" onbeforeunload="checkLeave()">
<div id="top" style="width:百分百;height:100px;">辽宁地图</div>
<div id="map" style="position:absolute;left:1px;right:0px;width:90%;height:80%;" >
</div>
<div id="query" style="position:absolute;right:0px;right:0px;width:10%;height:80%;">
    <table>
        <tr align="left">
            <td>条件查询</td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td>公司名称:<input id="pop" type="text" value=""/></td>
        </tr>
        <tr align="left">
            <td><a class="btn green mini" onclick="queryBySQL()" data-func="addC" href="#">查询</a>
                <a class="btn green mini" onclick="clearFeatures()" data-func="addC" href="#">清除</a>
            </td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td>企业ID:<input id="bob" type="text" value=""/></td>
        </tr>
        <tr align="left">
            <td><a class="btn green mini" onclick="queryBySQL2()" data-func="addC" href="#">查询</a></td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td><a class="btn green mini" onclick="drawGeometry1()" data-func="addC" href="#">查询(圆)</a></td>
        </tr>
        <tr align="left">
            <td><a class="btn green mini" onclick="drawGeometry2()" data-func="addC" href="#">查询(多边形)</a></td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td>
                <input type="button" value="间距量算" onclick="distanceMeasure()" />
                <input type="button" value="面积量算" onclick="areaMeasure()" />
            </td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td>
                <input type="button" value="标记" onclick="markPOI()" />
            </td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td>企业ID:<input id="qiyeid" type="text" value=""/></td>
        </tr>
        <tr align="left">
            <td><input type="button" value="删除" onclick="deleteSelectedFeature()" /></td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
        <tr align="left">
            <td><input type="button" value="彰显当前中央点" onclick="getCenterLonLat()" />
                <br>
                <input id="centerPoint" type="text" value="" readonly/>
                <br>
                <input type="button" value="展现当前比例尺" onclick="getScale()" />
                <br>
                <input id="scale" type="text" value="" readonly/>
            </td>
        </tr>
        <tr align="left">
            <td>**********************************************</td>
        </tr>
    </table>
</div>
</body>
</html>

table.featureInfo tr.odd td {
background: #eee;
}

// .......................................插入数据..................................................................
//推行增添地物
function addFeatureCompleted(geometryDate) {
    var temp = geometryDate.split(",");
    var geometry;
    geometry = new SuperMap.Geometry.Point(temp[0], temp[1]);
    var name = document.getElementById("enterpriseName").value;
    var add = document.getElementById("enterpriseAdd").value;
    var tel = document.getElementById("enterpriseTel").value;
    closeAddPoiPopup();
    var editFeatureParameter,
            editFeatureService,
            features = {
                fieldNames:["CORP_NAME","SMUSERID","TEL","ADDR"],
                fieldValues:[name,1,tel,add],
                geometry:geometry
            };
    editFeatureParameter = new SuperMap.REST.EditFeaturesParameters({
        features: [features],
        editType: SuperMap.REST.EditType.ADD,
        returnContent:true
    });
    editFeatureService = new SuperMap.REST.EditFeaturesService(url2, {
        eventListeners: {
            "processCompleted": addFeaturesProcessCompleted,
            "processFailed": processFailed
        }
    });
    editFeatureService.processAsync(editFeatureParameter);
}
//增多成功
function addFeaturesProcessCompleted(editFeaturesEventArgs) {
    ids = editFeaturesEventArgs.result.IDs,
            resourceInfo = editFeaturesEventArgs.result.resourceInfo;
    if(ids === null && resourceInfo === null) return;

table.featureInfo th {
padding: .2em .2em;
text-transform: uppercase;
font-weight: bold;
background: #eee;
}

//..............................................SQL查询..............................................................
//查询--集团名称
function queryBySQL() {
    clearFeatures();
    var pop = document.getElementById("pop").value;
    //var area = document.getElementById("area").value;
    if (pop==null || pop=="")
    {
        alert("请输入");
        return;
    }
    vectorLayer.removeAllFeatures();
    var queryParam, queryBySQLParams, queryBySQLService;
    queryParam = new SuperMap.REST.FilterParameter({
        name: "T_CCP_LABEL_CORP2@nanjingmap",
        attributeFilter: "CORP_NAME LIKE '%" pop "%'"
    }),
            queryBySQLParams = new SuperMap.REST.QueryBySQLParameters({
                queryParams: [queryParam]
            }),
            queryBySQLService = new SuperMap.REST.QueryBySQLService(url, {
                eventListeners: {"processCompleted": processCompleted, "processFailed": processFailed}});
    queryBySQLService.processAsync(queryBySQLParams);
}
// 查询--企业ID
function queryBySQL2() {
    clearFeatures();
    var bob = document.getElementById("bob").value;
    //var area = document.getElementById("area").value;
    if (bob==null || bob=="")
    {
        alert("请输入");
        return;
    }
    vectorLayer.removeAllFeatures();
    var queryParam, queryBySQLParams, queryBySQLService;
    queryParam = new SuperMap.REST.FilterParameter({
        name: "T_CCP_LABEL_CORP2@nanjingmap",
        attributeFilter: "SMID = " bob
    }),
            queryBySQLParams = new SuperMap.REST.QueryBySQLParameters({
                queryParams: [queryParam]
            }),
            queryBySQLService = new SuperMap.REST.QueryBySQLService(url, {
                eventListeners: {"processCompleted": processCompleted, "processFailed": processFailed}});
    queryBySQLService.processAsync(queryBySQLParams);
}
// 管理查询结果
function processCompleted(queryEventArgs) {
    var i, j, feature,
            result = queryEventArgs.result;
    if (result && result.recordsets) {
        for (i=0; i<result.recordsets.length; i ) {
            if (result.recordsets[i].features.length>0) {
                for (j=0; j<result.recordsets[i].features.length; j ) {
                    var feature = result.recordsets[i].features[j];
                    var point = feature.geometry;
                    if(point.CLASS_NAME == SuperMap.Geometry.Point.prototype.CLASS_NAME){
                        var size = new SuperMap.Size(44, 33),
                                offset = new SuperMap.Pixel(-(size.w/2), -size.h),
                                icon = new SuperMap.Icon("./theme/images/marker.png", size, offset);
                        var marker = new SuperMap.Marker(new SuperMap.LonLat(point.x, point.y), icon);
                        marker.sm_capital = feature.attributes.CORP_NAME ","
                                feature.attributes.ADDR ","
                                feature.attributes.TEL ","
                                feature.attributes.CORP_ORG ","
                                feature.attributes.CORP_ID ","
                                feature.attributes.PICTURE ","
                                feature.attributes.SMID;
                        marker.events.on({//注册点击事件的拍卖方法
                            "rightclick":clearMarker,
                            "dblclick":openInfoWin,
                            "scope": marker
                        });
                        //查询出来的结果只有一个时援救拖动
                        if(result.recordsets[i].features.length == 1){
                            //注册事件
                            marker.events.register("mousedown",marker,function(e){
                                isdrag = true;
                                //拿到marker的经纬度坐标
                                var lon = marker.lonlat;
                                //将经纬度坐标转变来荧屏坐标
                                var pixel = map.getPixelFromLonLat(lon);
                                //取整
                                tx = parseInt(pixel.x);
                                ty = parseInt(pixel.y);
                                //获取marker相对鼠标的岗位
                                x1 = marker ? e.clientX : event.clientX;
                                y1 = marker ? e.clientY : event.clientY;
                            });
                        }
                        markerLayer.addMarker(marker);
                        if (j==0){
                            map.panTo(new SuperMap.LonLat(point.x, point.y));
                            map.zoomTo(10);
                        }
                    }else{
                        feature.style = style;
                        vectorLayer1.addFeatures(feature);
                    }
                }
            }else{
                alert("未查询到结果!");
            }
        }
    }
}

//map.zoomToMaxExtent();
var zb=new OpenLayers.Control.ZoomBox({out:true});
var panel = new OpenLayers.Control.Panel({defaultControl: zb});
map.addControl(panel);
/************END************加载平日的根底控件********************************/

var map, local, layer, vectorLayer,vectorLayer1,markerLayer,drawLine,
        drawPolygon, lineLayer, polygonLayer,layerCorp,mousePosition,ids,centerLon,centerLat,presentScale, x1, y1,isdrag=false,
        style = {
            strokeColor: "#304DBE",
            strokeWidth: 1,
            fillColor: "#304DBE",
            fillOpacity: "0.8"
        },url = "http://192.168.1.19:8190/iserver/services/map-nanjing4/rest/maps/NanjingMapCorp",//静态切成丝地图
        styleline = {
            strokeColor: "#304DBE",
            strokeWidth: 2,
            pointerEvents: "visiblePainted",
            fillColor: "#304DBE",
            fillOpacity: 0.8
        },url2 = "http://192.168.1.19:8190/iserver/services/data-nanjing4/rest/data/datasources/nanjingmap/datasets/T_CCP_LABEL_CORP2";//数量更新
        
function init() {
    layer = new SuperMap.Layer.TiledDynamicRESTLayer("底图", url, {transparent: true, cacheEnabled: false, redirect: true},
            {scales:[1/5120000,1/2560000,1/1280000,1/640000,1/320000,1/160000,1/80000,1/40000,1/20000,1/10000,1/5000,1/2500]});
    layer.events.on({"layerInitialized":addLayer});
    vectorLayer = new SuperMap.Layer.Vector("Vector Layer");
    vectorLayer1 = new SuperMap.Layer.Vector("Vector Layer1");
    markerLayer = new SuperMap.Layer.Markers("Markers");

 

    map = new SuperMap.Map("map",{controls: [
        new SuperMap.Control.ScaleLine(),
        new SuperMap.Control.PanZoomBar({isShow: true}),
        mousePosition,
        new SuperMap.Control.OverviewMap(),
        new SuperMap.Control.LayerSwitcher({'ascending':false}),
        new SuperMap.Control.Navigation({
            dragPanOptions: {
                enableKinetic: true
            }
        }),
        drawPolygon1,drawPolygon2,drawLine, drawPolygon]
    });
}
function addLayer() {
    map.addLayers([layer,vectorLayer,vectorLayer1, markerLayer,lineLayer, polygonLayer]);
    map.setCenter(new SuperMap.LonLat(118.7263097340030100, 32.0086077019304014),10);
}

var streams = new OpenLayers.Layer.WMS( //图层组
"中国", "",
{
height: '330',
width: '698',
layers: 'china',
styles: '',
srs: 'EPSG:4610',
format: format,
tiled: 'true',
tilesOrigin : map.maxExtent.left ',' map.maxExtent.bottom
},
{
buffer: 0,
displayOutsideMaxExtent: true

//度量达成调用事件
function measureCompleted(measureEventArgs) {
    var distance = measureEventArgs.result.distance,
            area = measureEventArgs.result.area,
            unit = measureEventArgs.result.unit;
    if (distance != -1) {
        alert("量算结果:" distance "米");
    } else if (area != -1) {
        alert("量算结果:" area "平米");
    }
}

map.addLayers([streams,untiled]);
/********************END 加载图层*********************************/

//..........................................修改....................................................................
function editSelectedFeature(id,tmplon,tmplat) {
    if(id == null || id == ""
        || tmplon == null || tmplon == ""
        || tmplat == null || tmplat == ""){
        return;
    }
    var editFeatureParameter,
            editFeatureService,
            features,
            njEnterpriseName=document.getElementById("njEnterpriseName").value,
            njEnterpriseAdd=document.getElementById("njEnterpriseAdd").value,
            njEnterpriseTel=document.getElementById("njEnterpriseTel").value;
    if(njEnterpriseName == null || njEnterpriseName == ""
            || njEnterpriseAdd == null || njEnterpriseAdd == ""
            || njEnterpriseTel == null || njEnterpriseTel == ""){
            alert("请输入!");
        return;
    }
    closeInfoWin();
    var geometry = new SuperMap.Geometry.Point(tmplon, tmplat);
    features = {
        fieldNames:["CORP_NAME","SMUSERID","TEL","ADDR"],
        fieldValues:[njEnterpriseName,1,njEnterpriseTel,njEnterpriseAdd],
        geometry:geometry
    };
    features.geometry.id = id;
    editFeatureParameter = new SuperMap.REST.EditFeaturesParameters({
        features: [features],
        editType: SuperMap.REST.EditType.UPDATE
    });
    editFeatureService = new SuperMap.REST.EditFeaturesService(url2, {
        eventListeners: {
            "processCompleted": updateFeaturesProcessCompleted,
            "processFailed": processFailed
        }
    });
    editFeatureService.processAsync(editFeatureParameter);
}

#location {
float: right;
}

//点击标志弹出
var infowin2 = null;
function openInfoWin2(){
    closeInfoWin2();//关闭在此之前打开的窗口。
    var marker = this;
    if(confirm("明确毁灭该标识?"))
    {
        //如果是true
        alert("你按了明确,那便是回来true");
        marker.destroy();
    }
    else
    {
        //否则
        alert("你按了撤回,那便是回来false");
    }

#wrapper {
width: 698px;
}

//关闭窗口--改进弹出
function closeInfoWin2(){
    if(infowin2){
        try{
            infowin2.hide();//隐敝窗体对象
            infowin2.destroy();//消毁窗体对象
        }
        catch(e){
        }
    }
}
//关闭窗口--增多弹出
function closeAddPoiPopup(){
    if(addPoiPopup){
        try{
            addPoiPopup.hide();//隐敝窗体对象
            addPoiPopup.destroy();//消毁窗体对象
        }
        catch(e){
        }
    }
}

function init(){
format = 'image/png';
var bounds = new OpenLayers.Bounds( //地图区域限定
74.137, 6.319,
135.086, 53.558
);
var options = {
controls: [],
maxExtent: bounds,
maxResolution: 0.23808203125,
projection: "EPSG:4610",
numZoomLevels: 7,
units: 'degrees'
};
map = new OpenLayers.Map('map', options);

//..........................................展现当前宗旨点....................................................................
function getCenterLonLat(){
   var piont =  map.getCenter();
    centerLon = piont.lon;
    centerLat = piont.lat;
    document.getElementById("centerPoint").value =centerLon ":" centerLat;
}

/**********************加载图层 开首*******************************/
/* tiled = new OpenLayers.Layer.WMS( //图层组
"功底图层", "",
{
height: '330',
width: '698',
layers: 'sf',
styles: '',
srs: 'EPSG:4326',
format: format,
tiled: 'true',
tilesOrigin : map.maxExtent.left ',' map.maxExtent.bottom
},
{
buffer: 0,
displayOutsideMaxExtent: true
}
);*/

    /*
     注册featureadded事件,触发drawCompleted()方法
     譬喻登记"loadstart"事件的独门监听
     events.on({ "loadstart": loadStartListener });
     */
    drawLine.events.on({"featureadded": drawCompletedline});

/************************加载平日的底工控件********************************/
map.addControl(new OpenLayers.Control.PanZoomBar({ //增添平移缩放工具条
position: new OpenLayers.Pixel(2, 15)
}));
map.addControl(new OpenLayers.Control.Navigation()); //双击放大,平移
map.addControl(new OpenLayers.Control.Scale($('scale'))); //获取地图比例尺
map.addControl(new OpenLayers.Control.MousePosition({element: $('location')})); //获取鼠标的中纬度
map.setCenter(new OpenLayers.LonLat(100.254, 35.25), 1); //加多平移缩放工具条
map.addControl(new OpenLayers.Control.OverviewMap()); //增添鹰眼图
map.addControl(new OpenLayers.Control.LayerSwitcher({'ascending':false})); //图层切换工具
map.addControl(new OpenLayers.Control.Permalink('xxxx')); //增多长久链接
//map.addControl(new OpenLayers.Control.MouseToolbar());

    //创制画线调节,图层是lineLayer;这里DrawFeature(图层,类型,属性);multi:true在将在素放入图层在此之前是还是不是现将其归入几何图层中
    drawLine = new SuperMap.Control.DrawFeature(lineLayer, SuperMap.Handler.Path, { multi: true });

//获取面积的结果赋值
function handleMeasurements(event) {
var geometry = event.geometry;
var units = event.units;
var order = event.order;
var measure = event.measure;
var element = document.getElementById('output');
var out = "";
if(order == 1) {
out = "面积为: " measure.toFixed(3) " " units;
} else {
out = "面积为: " measure.toFixed(3) " " units "<sup>2</" "sup>";
}
element.innerHTML = out;
}
function setHTML(response){
document.getElementById('nodelist').innerHTML = response.responseText;
};
//缩小
function zoomOut(){
map.zoomOut();
}
//放大
function zoomIn(){
map.zoomIn();
}
//获取地图数据
function getSize(){
alert(map.getSize() ",高度为=" map.getSize().h);
}
//切换鼠标事件成效
function toggleControl(_value) {

//衡量--绘完触发事件
function drawCompletedline(drawGeometryArgs) {
    //撤废上次的鼠标效果
    clearDrawGeometry();
    //拿到图层几何对象
    var geometry = drawGeometryArgs.feature.geometry,
            measureParam = new SuperMap.REST.MeasureParameters(geometry), /* MeasureParameters:量算参数类。 客商端要量算的地物间的偏离或有个别区域的面积*/
            myMeasuerService = new SuperMap.REST.MeasureService(url); //量算服务类,该类担当将量算参数字传送递到服务端,并拿走服务端再次来到的量算结果
    myMeasuerService.events.on({ "processCompleted": measureCompleted });

/**********************************点、线、面衡量起头**********************************************/
var sketchSymbolizers = {
"Point": {
pointRadius: 4,
graphicName: "square",
fillColor: "white",
fillOpacity: 1,
strokeWidth: 1,
strokeOpacity: 1,
strokeColor: "#333333"
},
"Line": {
strokeWidth: 3,
strokeOpacity: 1,
strokeColor: "#666666",
strokeDashstyle: "dash"
},
"Polygon": {
strokeWidth: 2,
strokeOpacity: 1,
strokeColor: "#666666",
fillColor: "white",
fillOpacity: 0.3
}
};
var style = new OpenLayers.Style();
style.addRules([
new OpenLayers.Rule({symbolizer: sketchSymbolizers})
]);
var styleMap = new OpenLayers.StyleMap({"default": style});
measureControls = {
line: new OpenLayers.Control.Measure(
OpenLayers.Handler.Path, {
persist: true,
handlerOptions: {
layerOptions: {styleMap: styleMap}
}
}
),
polygon: new OpenLayers.Control.Measure(
OpenLayers.Handler.Polygon, {
persist: true,
handlerOptions: {
layerOptions: {styleMap: styleMap}
}
}
)
};
var control;
for(var key in measureControls) {
control = measureControls[key];
control.events.on({
"measure": handleMeasurements,
"measurepartial": handleMeasurements
});
map.addControl(control);
}
/***************************END************点,线、面积度量*****************************************/

//...............................................测量..........................................................................
//间距衡量
function distanceMeasure(){
    clearFeatures();
    drawLine.activate();
}

//加多点标记的图层
markers = new OpenLayers.Layer.Markers("markers");
map.addLayer(markers);
markers.setZIndex(200);

function closeInfoWin(){//关闭窗口--标志弹出
    if(infowin){
        try{
            infowin.hide();//掩盖窗体对象
            infowin.destroy();//消毁窗体对象
        }
        catch(e){
        }
    }
}

marker = new OpenLayers.Marker(new OpenLayers.LonLat(113.34851,33.22630), icon);
markers.addMarker(marker);

    //几何圆查询
    drawPolygon1 = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.RegularPolygon,{handlerOptions:{sides:50}});
    drawPolygon1.events.on({"featureadded": drawCompleted});

}

    var infowinHtml="";
    infowinHtml = '<div id="addInfo" class="infowindowTitle" style="width:270px;height:200px;"><div class="mapInfo"><h4>增添公司</h4>';

重大落成的效果与利益有放大,收缩,获取地图大小,平移,线路度量,面积测量,拉宽功用,呈现注解,移除注脚,画多边形获取经纬度坐标。依照经纬度坐标展现多边形。地图切换,图层调整等功效。

    //新建线矢量图层
    lineLayer = new SuperMap.Layer.Vector("lineLayer");
    //对线图层应用样式style(前边有定义卡塔尔
    lineLayer.style = styleline;
    //新建面矢量图层
    polygonLayer = new SuperMap.Layer.Vector("polygonLayer");
    //对面图层应用样式style(前面有定义卡塔 尔(英语:State of Qatar)
    polygonLayer.style = styleline;

for(key in measureControls) {
var control = measureControls[key];
if(_value == key ) {
control.activate();
} else {
control.deactivate();
}
}
}

//..........................................移动标识....................................................................
//marker移动方法
function movemouse(e)
{
    //鼠标的实时地点
    if (isdrag)
    {
        var x2,y2,marker,tempSm_capital;
        if(markerLayer.markers.length==1){
            marker = markerLayer.markers[0];
            tempSm_capital = marker.sm_capital;
        }
        //获取鼠标的实时地点
        x2 = marker ? tx e.clientX - x1 : tx event.clientX - x1;
        y2 = marker ? ty e.clientY - y1 : ty event.clientY - y1;
        //转为显示屏坐标
        var pix = new SuperMap.Pixel(x2,y2);
        //显示器坐标转为经纬度坐标
        var lon1 = map.getLonLatFromPixel(pix);
        //将从前的marker坐标清理
        markerLayer.clearMarkers();
        //var offset = new SuperMap.Pixel(x2,y2);
        var size = new SuperMap.Size(44, 33);
        var offset = new SuperMap.Pixel(-(size.w/2), -size.h);
        var icon = new SuperMap.Icon('./theme/images/marker.png',size, offset);
        marker = new SuperMap.Marker(lon1,icon);
        marker.sm_capital = tempSm_capital;
        marker.events.on({//注册点击事件的拍卖方式
            "rightclick":clearMarker,
            "dblclick":openInfoWin,
            "scope": marker
        });
        //注册事件
        marker.events.register("mousedown",marker,function(e){
            isdrag = true;
            var lon = marker.lonlat;
            var pixel = map.getPixelFromLonLat(lon);
            tx = parseInt(pixel.x);
            ty = parseInt(pixel.y);
            x1 = marker ? e.clientX : event.clientX;
            y1 = marker ? e.clientY : event.clientY;
        });
        markerLayer.addMarker(marker);
    }
}
document.onmousemove=movemouse;
document.onmouseup=new Function("isdrag=false");

</script>
</head>
<body onload="init()">
<div id="toolbar" style="display:">
<input type="button" value="放大" onclick="zoomIn()"/>
<input type="button" value="缩小" onclick="zoomOut()"/>
<input type="button" value="获取地图大小" onclick="getSize()"/>
<input type="button" value="平移" onclick="toggleControl('none')"/>
<input type="button" value="线路衡量" onclick="toggleControl('line')"/>
<input type="button" value="度量面积" onclick="toggleControl('polygon')"/>
<input type="button" value="shift拉框" onclick="boxExtend()"/>
<input type="button" value="展现标明" onclick="add马克尔()"/>
<input type="button" value="移除标记" onclick="remove马克尔()"/>
<input type="button" value="画多边形获取经纬度坐标" onclick="test()"/>
</div>
<div id="map">

    //多边形查询
    drawPolygon2 = new SuperMap.Control.DrawFeature(vectorLayer, SuperMap.Handler.Polygon);
    drawPolygon2.events.on({"featureadded": drawCompleted});

notice: function (bounds) {
var ll = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.left, bounds.bottom));
var ur = map.getLonLatFromPixel(new OpenLayers.Pixel(bounds.right, bounds.top));
alert(ll.lon.toFixed(4) ", "
ll.lat.toFixed(4) ", "
ur.lon.toFixed(4) ", "
ur.lat.toFixed(4));
}
});
map.addControl(controlBox);
}
var markers,marker;
var markArr=new Array();
function addMarker(){
var url = '';
var sz = new OpenLayers.Size(20, 20); //尺寸大小
var calculateOffset = function(size) {
return new OpenLayers.Pixel(-(size.w/2), -size.h);
};
var icon = new OpenLayers.Icon(url, sz, null, calculateOffset);

    infowinHtml ='<ul class="comInfo"><li>集团名称:<input type="text" id="enterpriseName" value=""></li>';
    infowinHtml ='<li>集团地点:<input type="text" id="enterpriseAdd" style="width:180px;" value=""></li>';
    infowinHtml ='<li>公司电话:<input type="text" id="enterpriseTel" style="width:180px;" value=""></li>';
    infowinHtml ='<li><input type="button" value="保 存" onclick=addFeatureCompleted("' infomation '") ></li>';
    infowinHtml ='</ul>';
    infowinHtml = '</div> </div>';
    //*********************
    //点击后pop弹窗
    addPoiPopup = new SuperMap.Popup.FramedCloud("popwin",new SuperMap.LonLat(num[0],num[1]),null,infowinHtml,null,true);
    map.addPopup(addPoiPopup,true);
    var size = new SuperMap.Size(44,33);
    var offset = new SuperMap.Pixel(-(size.w/2), -size.h);
    var icon = new SuperMap.Icon('./theme/images/marker.png', size, offset);
    var marker = new SuperMap.Marker(new SuperMap.LonLat(num[0],num[1]),icon);
    marker.events.on({//注册点击事件的管理办法
        "rightclick":clearMarker,
        "dblclick":openInfoWin2,
        "scope": marker
    });
    //注册事件
    marker.events.register("mousedown",marker,function(e){
        isdrag = true;
        //得到marker的经纬度坐标
        var lon = marker.lonlat;
        //将经纬度坐标转变到荧屏坐标
        var pixel = map.getPixelFromLonLat(lon);
        //取整
        tx = parseInt(pixel.x);
        ty = parseInt(pixel.y);
        //获取marker相对鼠标的地点
        x1 = marker ? e.clientX : event.clientX;
        y1 = marker ? e.clientY : event.clientY;
    });
    markerLayer.addMarker(marker);
    info = "";
}

/* Styles used by the default GetFeatureInfo output, added to make IE happy */
table.featureInfo, table.featureInfo td, table.featureInfo th {
border: 1px solid #ddd;
border-collapse: collapse;
margin: 0;
padding: 0;
font-size: 90%;
padding: .2em .1em;
}

//杀绝上次的鼠标效果
function clearDrawGeometry(){
    drawLine.deactivate();
    drawPolygon.deactivate();
    drawPolygon1.deactivate();
    drawPolygon2.deactivate();
}

table.featureInfo caption {
text-align: left;
font-size: 100%;
font-weight: bold;
text-transform: uppercase;
padding: .2em .2em;
}
</style>
<!-- Import OpenLayers, reduced, wms read only version -->
<script src="../lib/OpenLayers.js" ></script>
<script src=";
<script defer="defer" type="text/javascript">
var map, measureControls;
var untiled;
var tiled;

//................................................点击弹出.................................................................
//点击标识弹出
var infowin = null;
function openInfoWin(){
    closeInfoWin();//关闭早先张开的窗口。
    var marker = this;
    var lonlat = marker.lonlat;
    var corp = marker.sm_capital.split(",");
    var picturenum = corp[5];
    var id = corp[6];
    var infowinHtml='<div>公司名称:<input type="text" id="njEnterpriseName" style="width:180px;" value="' corp[0] '">'
            '</br>公司地点:<input type="text" id="njEnterpriseAdd" style="width:180px;" value="' corp[1] '">'
            '</br>公司电话:<input type="text" id="njEnterpriseTel" style="width:180px;" value="' corp[2] '">'
            '</br><a href="#" onclick="enterpriseInfomation(' corp[3] ',' corp[4] ')">详细新闻</a>'
            '   <a href="#" onclick="editSelectedFeature(' id ',' lonlat.lon ',' lonlat.lat ')">修改</a>'
            '   <a href="#" onclick="deleteSelectedFeatureById(' id ')">删除</a>'
            '</div>';
    var size = new SuperMap.Size(44, 33);
    var offset = new SuperMap.Pixel(0, -size.h);
    var icon = new SuperMap.Icon("./theme/images/marker.png", size, offset);
    var popup = new SuperMap.Popup.FramedCloud("popwin",
            new SuperMap.LonLat(lonlat.lon,lonlat.lat),
            null,
            infowinHtml,
            icon,
            true);
    infowin = popup;
    map.addPopup(popup);
}

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd">
<html xmlns=";
<head>
<title>OpenLayers map preview</title>
<!-- Import OL CSS, auto import does not work with our minified OL.js build -->
<link rel="stylesheet" type="text/css" href="../theme/default/style.css"/>
<link rel="stylesheet" href="../theme/default/google.css" type="text/css">
<!-- Basic CSS definitions -->
<style type="text/css">
/* General settings */
body {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: small;
}
/* Toolbar styles */
#toolbar {
position: relative;
padding-bottom: 0.5em;

<!DOCTYPE HTML>
<html xmlns="">
<meta charset="UTF-8">
<head>
<title>SuperMap iClient JavaScript:TiledDynamicRESTLayer</title>
<script src="./libs/SuperMap.Include.js"></script>
<script type="text/javascript">

table.featureInfo td {
background: #fff;
}

    var lonlat = marker.lonlat;
    //queryIdBySQL(lonlat.lon,lonlat.lat);
    var infowinHtml="";
    infowinHtml = '<div id="updateInfo" class="infowindowTitle" style="width:270px;height:200px;"><div class="mapInfo"><h4>改正公司</h4>';
    infowinHtml ='<ul class="comInfo"><li>集团名称:<input type="text" id="updateEnterpriseName" value="' '"></li> ';
    infowinHtml ='<li>公司地点:<input type="text" id="updateEnterpriseAdd" style="width:180px;" value="' '"></li>';
    infowinHtml ='<li>集团电话:<input type="text" id="updateEnterpriseTel" style="width:180px;" value="' '"></li>';
    infowinHtml ='<li><input type="button" value="保 存" onclick=updateSelectedFeature() >' '</li>   ';
    infowinHtml ='   <input type="button" value="删 除" onclick=deleteSelectedFeature() >' '</li></ul>';
    infowinHtml = '</div> </div>';
    var size = new SuperMap.Size(44, 33);
    var offset = new SuperMap.Pixel(-(size.w/2), -size.h);
    //var offset = new SuperMap.Pixel(0, -size.h);
    var icon = new SuperMap.Icon("./theme/images/marker.png", size, offset);
    var popup = new SuperMap.Popup.FramedCloud("popwin",
            new SuperMap.LonLat(lonlat.lon,lonlat.lat),
            null,
            infowinHtml,
            icon,
            true);
    infowin = popup;
    map.addPopup(popup);
}

// marker = new OpenLayers.Marker(madrid, icon.clone());
// markers.addMarker(marker);
}
function removeMarker() {
markers.removeMarker(marker);
}
/*******************多边形获取经纬度坐标系*************************/
function test(){
var getpolygonxy = new OpenLayers.Control();
OpenLayers.Util.extend(getpolygonxy, {
draw: function() {
this.polygon= new OpenLayers.Handler.Polygon(getpolygonxy ,
{ "done": this.notice },{ "persist": true},
{ keyMask: OpenLayers.Handler.MOD_SHIFT });
this.polygon.activate();
},
notice: function(bounds) {
alert(bounds);//坐标音信
}
});
map.addControl(getpolygonxy);
}

//.......................................点击标记.....................................................
function markPOI() {
    //先打消上次的体现结果
    clearFeatures();
    //撤废上次的鼠标效果
    clearDrawGeometry();
    map.events.on({"click":addPOIHandler});
}

}

//面积度量
function areaMeasure(){
    clearFeatures();
    drawPolygon.activate();
}

/* The map and the location bar */
#map {
clear: both;
position: relative;
width: 698px;
height: 330px;
border: 1px solid black;
}

// 圆形查询
function drawCompleted(drawGeometryArgs) {
    getScale();
    //衰亡上次的鼠标效果
    clearDrawGeometry();
    var feature = new SuperMap.Feature.Vector();
    feature.geometry = drawGeometryArgs.feature.geometry,
            feature.style = style;
    vectorLayer.addFeatures(feature);

function addPOIHandler(arg,geometry){
    clientX = arg.clientX;
    clientY = arg.clientY;
    //获取浏览器页面包车型地铁上升的幅度和可观
    var clientWidth = document.body.clientWidth;
    var clientHeight = document.body.clientHeight;
    //获取地图的惊人和幅度
    var mapWidth = map.size.w;
    var mapHeight = map.size.h;
    //当前point的经纬度坐标=传入坐标-(当前页面中度-地图的可观)
    var px = new SuperMap.Pixel(clientX-(clientWidth-mapWidth),clientY-(clientHeight-mapHeight));
    var point = map.getLonLatFromPixel(px);
    var x = clientX-(clientWidth-mapWidth);
    var y = clientY-(clientHeight-mapHeight);
    map.events.unregister("click",map,addPOIHandler);
    addPOI(x,y);
}
var addPoiPopup = null;
function addPOI(x,y)
{ //获取鼠标地点
    var my_mouse = document.getElementById("SuperMap.Control.MousePosition_57");
    var num = my_mouse.innerHTML.split(',');
    var infomation=num[0].trim() "," num[1].trim();

//更新地物实现
function updateFeaturesProcessCompleted(editFeaturesEventArgs) {
    if(editFeaturesEventArgs.result.resourceInfo.succeed) {
        alert("更新成功");
        //重新加载图层
        getCenterLonLat();
        getScale();
        //重新加载图层
        clearFeatures();
        map.removeLayer(layer,true);
        layer = new SuperMap.Layer.TiledDynamicRESTLayer("底图", url, {transparent: true, cacheEnabled: false, redirect: true},
                {scales:[1/5120000,1/2560000,1/1280000,1/640000,1/320000,1/160000,1/80000,1/40000,1/20000,1/10000,1/5000,1/2500]});
        layer.events.on({"layerInitialized":reloadLayer});
    }
    else {
        alert("更新失败");
    }
}

    //创造画面调节,图层是polygonLayer
    drawPolygon = new SuperMap.Control.DrawFeature(polygonLayer, SuperMap.Handler.Polygon);
    drawPolygon.events.on({"featureadded": drawCompletedline});

    //页面鼠标移动控件
    mousePosition = new SuperMap.Control.MousePosition({emptyString:"0,0"});
    mousePosition.numDigits=16;

    if((ids && ids.length > 0) || (resourceInfo && resourceInfo.succeed)) {
        alert("新添成功");
        getCenterLonLat();
        getScale();
        //重新加载图层
        clearFeatures();
        map.removeLayer(layer,true);
        layer = new SuperMap.Layer.TiledDynamicRESTLayer("底图", url, {transparent: true, cacheEnabled: false, redirect: true},
                {scales:[1/5120000,1/2560000,1/1280000,1/640000,1/320000,1/160000,1/80000,1/40000,1/20000,1/10000,1/5000,1/2500]});
        layer.events.on({"layerInitialized":reloadLayer});
    }else {
        alert("新扩张退步");
    }
}

// 管理特别,弹出
function processFailed(e) {
    alert(e.error.errorMsg);
}
// 毁灭页面标志
function clearFeatures() {
    vectorLayer.removeAllFeatures();
    vectorLayer1.removeAllFeatures();
    lineLayer.removeAllFeatures();
    polygonLayer.removeAllFeatures();
    markerLayer.clearMarkers();
}

    //对MeasureService类型进行判别和赋值,当判定出是LineString时设置MeasureMode.DISTANCE,不然是MeasureMode.AREA
    if (geometry.CLASS_NAME.indexOf("LineString") > -1) {
        myMeasuerService.measureMode = SuperMap.REST.MeasureMode.DISTANCE;
    } else {
        myMeasuerService.measureMode = SuperMap.REST.MeasureMode.AREA;
    }
    myMeasuerService.processAsync(measureParam); //processAsync负担将客户端的量算参数字传送递到服务端。
}

本文由分分快三计划发布,转载请注明来源

关键词: 分分快三计划 openlayers