通过地图事件,调用中地的服务添加点要素

    1. 1、通过事件获取地图坐标
    2. 2、根据坐标,向地图文档(mapgis数据库)添加点要素
    1. <!DOCTYPE html>
    2. <html lang="en">
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
    7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    8.     <title>Document</title>
    9.     <script src="../../lib/include-openlayers-local.js"></script>
    10.     <script src="../../js/Gaode.js"></script>
    11. </head>
    13. <body>
    14.     <div id="map_container">
    16.     </div>
    17.     <script>
    18.         const docLayer = new Zondy.Map.Doc('', 'smart_city01', {
    19.             ip: 'localhost',
    20.             port: 6163
    21.         })
    22.         const map = new ol.Map({
    23.             target: 'map_container',
    24.             layers: [Gaode, docLayer],
    25.             view: new ol.View({
    26.                 projection: 'EPSG:4326',
    27.                 center: [114, 30],
    28.                 zoom: 4
    29.             })
    30.         })
    31.         map.on('click',function(e){
    32.             var coordinate = e.coordinate;
    33.             addPoint(coordinate)
    34.         })
    35.         /* 添加一个点到数据库 */
    36.         function addPoint(position) {
    37.             /* 2.1构建几何信息 */
    38.             /* 创建一个点形状,描述点形状的几何信息 */
    39.             var gpoint = new Zondy.Object.GPoint(position[0],position[1])
    40.             /* 设置当前点要素的几何信息 */
    41.             var fGeom = new Zondy.Object.FeatureGeometry({
    42.                 PntGeom: [gpoint]
    43.             })
    44.             /* 2.2 设置样式信息 */
    45.             var pointInfo = new Zondy.Object.CPointInfo({
    46.                 Angle: 0,
    47.                 Color: 2, //子图的颜色
    48.                 Space: 0,
    49.                 SymHeight: 5, //点的高度
    50.                 SymID: 31,
    51.                 SymWidth: 5 //点的宽度
    52.             })
    53.             /* 设置当点要素的图形参数信息 */
    54.             var webGraphicInfo = new Zondy.Object.WebGraphicsInfo({
    55.                 InfoType: 1, //点
    56.                 PntInfo: pointInfo
    57.             })
    58.             /* 2.3 设置属性信息 */
    59.             /* 设置添加点要素的属性信息 */
    60.             var attValue = ['上海']
    61.             /* 2.4  构建要素对象 */
    62.             var feature = new Zondy.Object.Feature({
    63.                 fGeom: fGeom, //坐标--几何信息
    64.                 GraphicInfo: webGraphicInfo, //样式信息
    65.                 AttValue: attValue //属性
    66.             })
    67.             /* 设置要素为点要素 
    68.             点 -->1
    69.             线 -->2
    70.             面 -->3
    71.             */
    72.             feature.setFType(1)
    73.             /* 2.5 设置要素集 */
    74.             //创建一个要素数据集
    75.             var featureSet = new Zondy.Object.FeatureSet()
    76.             /* 设置属性结构 */
    77.             var cAttStruct = new Zondy.Object.CAttStruct({
    78.                 FldName: ['name'], //属性的字段名
    79.                 FldNumber: 1, //属性的个数
    80.                 FldType: ['string'] //属性的类型
    81.             })
    82.             featureSet.AttStruct = cAttStruct
    83.             /* 添加要素到要素数据集 */
    84.             featureSet.addFeature(feature)
    85.             /* 2.6 调用编辑服务接口 */
    86.             /* 
    87.             创建一个编辑服务类 
    88.             第一个参数：服务的名称 第二参数：图层的名称
    89.             */
    90.             var editService = new Zondy.Service.EditDocFeature('smart_city01', 0, {
    91.                 ip: 'localhost',
    92.                 port: '6163' //访问IGServer的端口号, .net为6163,Java为8089
    93.             })
    94.             //执行添加点要素功能
    95.             editService.add(featureSet, onPntSuccess)
    96.         }
    98.         function onPntSuccess(data) {
    99.             if (data.succeed) {
    100.                 alert('添加成功')
    101.                 docLayer.refresh(); //重新加载地图文档
    102.             } else {
    103.                 alert('添加点要素失败')
    104.             }
    105.         }
    106.     </script>
    107. </body>
    109. </html>