ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

Cesium 添加 Polygon与multiPolygon

2021-06-13 10:05:58  阅读:482  来源: 互联网

标签:polygon holes polygonString let Cesium multiPolygon data dataArray Polygon


转载 Cesium 添加 Polygon与multiPolygon

为了逻辑清晰,我把代码分成了如下几部分,亲测可用

1)首先区分是polygon还是multiPolygon,若为multpolygon,则首先把multpolygon拆分为多个polygon,然后循环,把polygon字符串上球

addMultiPolygon(polygonString) {
   
     
     
   this.clearAll();  // 清空球上实体
    // polygonString 可能以multiPolygon,或者polygon开头
    // 若字符串以MulitPolyGon开头 
    if (polygonString.startsWith("MULTIPOLYGON")) {
   
     
     
        let polyganList = this.multPolyganToList(polygonString); // 把multipolygon处理成多个polygon
        polyganList.forEach((polygon)=>{
   
     
     
            this.addPolygon(polygon);
        })
        this.viewer.zoomTo(this.viewer.entities);
    } 
    else {
   
     
     
        this.addPolygon(polygonString);
        this.viewer.zoomTo(this.viewer.entities);
    } 
},

2)把mulitPolygon字符串处理成polygon字符串数组

// 把multiPolygon处理成多个polygon
multPolyganToList(data) {
   
     
     
   let ployganStringList = [];
   let tempData = data.slice(16,data.length-3);
   let tempPloyganList = tempData.split(')), ((');
   tempPloyganList.forEach((val)=>{
   
     
     
       let polygan = "POLYGON ((" + val + "))";
       ployganStringList.push(polygan);
   return ployganStringList;
},

3)把polygon字符串上球,polygon中可能含有hole,因此需要单独处理,把polygon字符串处理成多个polygon字符串,然后上球

// polygon中可能包含hole,因此需要做判断
 addPolygon(polygonString) {
   
     
     
    if(polygonString === 'POLYGON ((-180 -90, -180 90, 180 90, 180 -90, -180 -90))') {
   
     
     
         this.$message.warning('该类数据覆盖全球');
         return;
     }
     if(polygonString.indexOf('), (')!=-1) {
   
     
     
         let polyganList = this.PolyganToList(polygonString); // POLYGON处理成多个polygon
         let dataArray = polyganList[0];
         let holes = []
         for (let i = 1;i < polyganList.length; i++) {
   
     
     
             holes.push({
   
     
     
                 positions: Cesium.Cartesian3.fromDegreesArray(polyganList[i]),
             }, )
         }
         this.addPolygonWithHoles(dataArray,this.viewer,holes)
     } else {
   
     
     
         let polygon = this.wktToPolygonArray(polygonString);
         this.addPolygonPlane(polygon,this.viewer);
     } 
 },

4)polygon中可能包含holes,若存在holes,把polygon字符串再处理成多个polygon字符串的列表

// polygon中包含多个polygon
PolyganToList(data) {
   
     
     
    let ployganList = [];
    let tempData = data.slice(10,data.length-2);
    let tempPloyganList = tempData.split(')), ((');
    tempPloyganList.forEach((val)=>{
   
     
     
        if(val.indexOf('), (')!=-1) {
   
     
     
            let itemList = val.split('), (');
            itemList.forEach((item)=>{
   
     
     
                let itemPolygon = "POLYGON ((" + item + "))";
                ployganList.push(this.wktToPolygonArray(itemPolygon));
            })
        }  
    })
    return ployganList;
},

5)把单个polygon转成cesium可以上球的数据

// 单个polygon转cesium可上球的数据
 wktToPolygonArray(data) {
   
     
     
      let dataArray = [];
      let tempData = data.slice(10,data.length-2);
      let pointArray = tempData.split(', ');
      pointArray.forEach((val)=>{
   
     
     
          let l = val.split(' ');
          dataArray.push(Number(l[0]));
          dataArray.push(Number(l[1]));
      })
      return dataArray;
  },
// 添加多边形plane为holes
 // polygon中会有holes
addPolygonWithHoles(dataArray,viewer,holes) {
   
     
     
    viewer.entities.add({
   
     
     
    name: "Blue polygon with holes",
        polygon: {
   
     
     
            hierarchy: {
   
     
     
                positions: Cesium.Cartesian3.fromDegreesArray(dataArray),
                holes: holes
                },
            material: Cesium.Color.CORNFLOWERBLUE.withAlpha(0.4),
            height: 0,
            outline: true, // height is required for outline to display
            outlineColor: Cesium.Color.DODGERBLUE, 
        },
    });
},

标签:polygon,holes,polygonString,let,Cesium,multiPolygon,data,dataArray,Polygon
来源: https://www.cnblogs.com/hustshu/p/14879692.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有