cd-mapgis 1.0.36 → 1.0.37

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cd-mapgis",
-  "version": "1.0.36",
+  "version": "1.0.37",
   "main": "./src/index.js",
   "types": "./src/index.d.ts",
   "type": "module",

package/src/LayerUtil.js

@@ -11,6 +11,7 @@ import GeoJSON from 'ol/format/GeoJSON.js';
 import Feature from 'ol/Feature.js';
 import VectorSource from 'ol/source/Vector.js';
 import VectorLayer from 'ol/layer/Vector.js';
+import StyleUtil from './StyleUtil.js';
 
 /**
  * 图层工具
@@ -190,11 +191,12 @@ export default class LayerUtil {
         return null;
     }
     /**
-     * 将geoJson数据包装为一个图层
+     * 将单个geoJson数据包装为一个图层
      * @param {*} json 
      */
     static getJsonLayer(p) {
-        let geometry = new GeoJSON().readGeometry(p.data);
+        let geoJSON = new GeoJSON();
+        let geometry = geoJSON.readGeometry(p.data);
         let feature = new Feature({ geometry: geometry });
         let vectorSource = new VectorSource({ features: [feature] });
         let layer = new VectorLayer({
@@ -203,4 +205,43 @@ export default class LayerUtil {
         });
         return { layer: layer, geometry: geometry };
     }
+    /**
+     * 将geoJson的点集合数据包装为一个图层
+     * @param {*} p {geoJsons:[],img:{url,anchor},text:{str,font,color,offsetY}}
+     */
+    static getJsonPointsLayer(p) {
+        let geoJSON = new GeoJSON();
+        let vectorSource = new VectorSource({ features: [] });
+        let layer = new VectorLayer({
+            source: vectorSource,
+            style: StyleUtil.getPointStyle(p)
+        });
+        for (let i = 0; i < p.geoJsons; i++) {
+            let json = p.geoJsons[i];
+            var f = new ol.Feature({
+                geometry: geoJSON.readGeometry(json)
+            });
+            vectorSource.addFeature(f);
+        }
+        return layer;
+    }
+    /**
+     * 将geoJson的多边形集合数据包装为一个图层
+     * @param {*} p 
+     */
+    static getJsonPolygonsLayer(p) {
+        let vectorSource = new VectorSource({ features: [] });
+        let layer = new VectorLayer({
+            source: vectorSource,
+            style: StyleUtil.getPolygonStyle(p)
+        });
+        for (let i = 0; i < p.geoJsons; i++) {
+            let json = p.geoJsons[i];
+            var f = new ol.Feature({
+                geometry: geoJSON.readGeometry(json)
+            });
+            vectorSource.addFeature(f);
+        }
+        return layer;
+    }
 }

package/src/StyleUtil.js

@@ -2,6 +2,8 @@ import Style from 'ol/style/Style.js';
 import Stroke from 'ol/style/Stroke.js';
 import Fill from 'ol/style/Fill.js';
 import Circle from 'ol/style/Circle.js';
+import Icon from 'ol/style/Icon.js';
+import Text from 'ol/style/Text.js';
 
 /**
  * 样式工具类
@@ -57,7 +59,7 @@ export default class StyleUtil {
             }),
             stroke: new Stroke({
                 color: 'rgba(0, 0, 255, 1)',
-                lineDash: [10, 10],
+                lineDash: [10, 10], //虚线
                 width: 2
             }),
             image: new Circle({
@@ -71,4 +73,79 @@ export default class StyleUtil {
             })
         });
     }
+    /**
+     * 获取图片样式
+     * @param {*} p 
+     * @returns 
+     */
+    static getIcon(p) {
+        let anchor = p.anchor ? p.anchor : [0.5, 0.5];//锚点，0.5,0.5 图片水平偏移一半，垂直偏移一半（变成居中）
+        return new Icon({
+            anchor: anchor,
+            anchorOrigin: 'top-right',
+            anchorXUnits: 'fraction',
+            anchorYUnits: 'pixels',
+            offsetOrigin: 'top-right',
+            // offset:[0,10],
+            //图标缩放比例
+            //scale:0.5,
+            //透明度
+            //opacity: 0.75,
+            //图标的url
+            src: p.url
+        });
+    }
+    /**
+     * 获取文字样式
+     * @param {*} p 
+     * @returns 
+     */
+    static getText(p) {
+        let font = p.font ? p.font : 'bold 20px 宋体';
+        let corlor = p.corlor ? p.corlor : '#0619e9';
+        let offsetY = p.offsetY ? p.offsetY : -10;
+        return new Text({
+            text: p.str,  // 从要素属性获取文字
+            font: font,
+            fill: new Fill({
+                color: corlor
+            }),
+            offsetX: 0,
+            offsetY: offsetY  // 文字显示在图标上方
+        });
+    }
+    /**
+     * 获取点的样式
+     * @param {*} p 
+     * @returns 
+     */
+    static getPointStyle(p) {
+        let styleParam = {};
+        if (p.img) {
+            styleParam.image = StyleUtil.getIcon(p.img);
+        }
+        if (p.text) {
+            styleParam.text = StyleUtil.getText(p.text);
+        }
+        return new Style(styleParam);
+    }
+    /**
+     * 获取多边形的样式
+     * @param {*} p 
+     * @returns 
+     */
+    static getPolygonStyle(p) {
+        let fill = p.fill ? p.fill : 'rgba(255, 255, 255, 0.2)';
+        let lineColor = p.lineColor ? p.lineColor : 'rgba(0, 0, 255, 1)';
+        let lineWidth = p.lineWidth ? p.lineWidth : 2;
+        return new Style({
+            fill: new Fill({
+                color: fill
+            }),
+            stroke: new Stroke({
+                color: lineColor,
+                width: lineWidth
+            })
+        });
+    }
 }

package/src/index.d.ts

@@ -22,7 +22,7 @@ declare module 'cd-mapgis' {
       data: string;
     }): void;
     static expandExtent(extent: number[]): number[];
-    static addOverlay(p:{html:string,point:number[],positioning?:string}): void;
+    static addOverlay(p: { html: string, point: number[], positioning?: string }): void;
     static initParam(params: any): void;
     static post(url: string, data: any): Promise<any>;
     static getDic(key: string): Promise<any>;
@@ -33,6 +33,8 @@ declare module 'cd-mapgis' {
     static buffer(p: any): Promise<any>;
     static getBound(p: any): Promise<any>;
     static checkPushLayers(p: any): Promise<any>;
+    static getLayerAttr(p: any): Promise<any>;
+    static getAddressByPoint(p: any): Promise<any>;
     static viewLayers(p: any): Promise<any>;
     static fitToLayers(p: any): void;
   }
@@ -67,6 +69,9 @@ declare module 'cd-mapgis' {
     static getWmtsLayer(p: {
       url: string;
     }): Promise<any>;
+    static getJsonLayer(p: any): any;
+    static getJsonPointsLayer(p: any): any;
+    static getJsonPolygonsLayer(p: any): any;
   }
   export class Overlay {
     constructor(data: any);