1. <!DOCTYPE html>
    2. <html lang="en">
    4. <head>
    5.     <meta charset="UTF-8">
    6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
    7.     <title>Document</title>
    8.     <script src="./dist/include-openlayers-local.js"></script>
    9.     <script src="./libs/gaode.js"></script>
    10. </head>
    12. <body>
    13.     <button onclick="topAnalysis()">拓扑相交分析</button>
    14.     <div id="map_container">
    15.     </div>
    16.     <script>
    17.         var map = new ol.Map({
    18.             target: "map_container",
    19.             layers: [gaode],
    20.             view: new ol.View({
    21.                 projection: 'EPSG:4326',
    22.                 center: [114.30, 30.50],
    23.                 zoom: 8
    24.             })
    25.         })
    26.         //1、准备第一个图形
    27.         const lineObj = new Zondy.Object.GLine(
    28.             new Zondy.Object.AnyLine([
    29.                 new Zondy.Object.Arc([
    30.                     new Zondy.Object.Point2D(114.4, 30.6),
    31.                     new Zondy.Object.Point2D(114.45, 30.2)
    32.                 ])
    33.             ])
    34.         )
    35.         //2、准备第二个比较图形
    36.         const regionObj = new Zondy.Object.GRegion([
    37.             new Zondy.Object.AnyLine([
    38.                 new Zondy.Object.Arc([
    39.                     new Zondy.Object.Point2D(114.301586, 30.533613),
    40.                     new Zondy.Object.Point2D(114.301586, 30.396517),
    41.                     new Zondy.Object.Point2D(114.544453, 30.396517),
    42.                     new Zondy.Object.Point2D(114.444453, 30.533613),
    43.                     new Zondy.Object.Point2D(114.401586, 30.533613)
    44.                 ])
    45.             ])
    46.         ])
    47.         //将点几何和区几何添加到地图进行显示（非必需，仅仅为了在地图上高亮显示图形）
    48.         var linePntArr = [];
    49.         var linPointArr = [];
    50.         for (var i = 0; i < lineObj.Line.Arcs[0].Dots.length; i++) {
    51.             linePntArr.push([lineObj.Line.Arcs[0].Dots[i].x, lineObj.Line.Arcs[0].Dots[i].y]);
    52.         }
    53.         for (var i = 0; i < regionObj.Rings[0].Arcs[0].Dots.length; i++) {
    54.             linPointArr.push([regionObj.Rings[0].Arcs[0].Dots[i].x, regionObj.Rings[0].Arcs[0].Dots[i].y]);
    55.         }
    56.         //创建要素1（线要素）
    57.         var feature1 = new ol.Feature({
    58.             geometry: new ol.geom.LineString(linePntArr)
    59.         });
    60.         //设置要素样式
    61.         feature1.setStyle(new ol.style.Style({
    62.             stroke: new ol.style.Stroke({
    63.                 color: 'rgba(41,57,85,1)',
    64.                 width: 3
    65.             })
    66.         }));
    67.         //创建要素2（区要素）
    68.         var feature2 = new ol.Feature({
    69.             geometry: new ol.geom.Polygon([linPointArr])
    70.         });
    71.         //设置要素样式
    72.         feature2.setStyle(new ol.style.Style({
    73.             fill: new ol.style.Fill({
    74.                 color: 'rgba(22,197,199,0.5)'
    75.             }),
    76.             stroke: new ol.style.Stroke({
    77.                 color: 'rgba(22,197,199,0.5)',
    78.                 width: 3
    79.             })
    80.         }));
    81.         //创建资源
    82.         var source = new ol.source.Vector({
    83.             features: [feature1, feature2],
    84.             warpX: false
    85.         });
    86.         var graphicLayer = new ol.layer.Vector({
    87.             source: source
    88.         });
    89.         map.addLayer(graphicLayer);
    90.         //3、调用分析服务
    91.         function topAnalysis() {
    92.             var topParam = new Zondy.Service.TopAnalysis({
    93.                 ip: 'localhost',
    94.                 port: '6163'
    95.             })
    96.             topParam.setLine(lineObj)
    97.             //调用setRelativeObj方法,设置拓扑分析参照物
    98.             topParam.setRelativeObj(regionObj);
    99.             topParam.nearDis = '0.05'
    100.             topParam.execute(onSuccess, onError)
    101.         }
    103.         function onSuccess(result) {
    104.             console.log(result)
    105.         }
    107.         function onError(err) {
    108.             console.log(err)
    109.         }
    110.     </script>
    111. </body>
    113. </html>