解决单体化不能交互的问题

liubgithub · liubgithub · commit 913893ee34dd · 2023-07-20T18:37:15.000+08:00
diff --git a/public/codes/3d/3dtiles/custom-monomer/index.js b/public/codes/3d/3dtiles/custom-monomer/index.js
@@ -31,6 +31,7 @@ function createMap(mapDiv, center, zoom, pitch, dragRotatePitch, dragPitch) {
 
 function create3DtilesLayer() {
   const layer = new maptalks.Geo3DTilesLayer("3dtiles", {
+    geometryEvents: true,
     services: [
       {
         url: "http://resource.dvgis.cn/data/3dtiles/dayanta/tileset.json",
diff --git a/public/codes/3d/3dtiles/floor-entity/index.js b/public/codes/3d/3dtiles/floor-entity/index.js
@@ -24,6 +24,7 @@ const map = new maptalks.Map("map", {
 });
 
 const layer = new maptalks.Geo3DTilesLayer("3dtiles", {
+  geometryEvents: true,
   services: [
     {
       url: "http://resource.dvgis.cn/data/3dtiles/dayanta/tileset.json",
diff --git a/public/codes/3d/3dtiles/room-entity/index.js b/public/codes/3d/3dtiles/room-entity/index.js
@@ -24,6 +24,7 @@ const map = new maptalks.Map("map", {
 });
 
 const layer = new maptalks.Geo3DTilesLayer("3dtiles", {
+  geometryEvents: true,
   services: [
     {
       url: "http://resource.dvgis.cn/data/3dtiles/dayanta/tileset.json",
diff --git a/public/codes/3d/spatial-analysis/excavate/index.js b/public/codes/3d/spatial-analysis/excavate/index.js
@@ -69,9 +69,9 @@ const groupGLLayer = new maptalks.GroupGLLayer("gl", [layer], {
         type: "lit"
       },
       symbol: {
-        polygonOpacity: 1,
+        polygonOpacity: 0.6,
         material: {
-          baseColorFactor: [0.48235, 0.48235, 0.48235, 1],
+          baseColorFactor: [0.48235, 0.48235, 0.48235, 0.8],
           hsv: [0, 0, -0.532],
           roughnessFactor: 0.22,
           metallicFactor: 0.58
@@ -80,36 +80,70 @@ const groupGLLayer = new maptalks.GroupGLLayer("gl", [layer], {
     }
   }
 }).addTo(map);
+const polygonLayer = new maptalks.PolygonLayer('polygonlayer').addTo(groupGLLayer);
+function AddPipeLine() {
+  const style = {
+    style: [
+      {
+        filter: true,
+        renderPlugin: {
+          dataConfig: {
+            type: "round-tube",
+            radialSegments: 16,
+            metric: "cm",
+          },
+          sceneConfig: {},
+          type: "tube",
+        },
+        symbol: {
+          lineColor: {
+            type: 'identity',
+            property: 'type'
+          },
+          lineWidth: {
+            type: 'identity',
+            property: 'width'
+          },
+          metallicFactor: 1,
+          roughnessFactor: 0.3,
+        },
+      },
+    ],
+  };
+  const pipeline = new maptalks.GeoJSONVectorTileLayer("vt", {
+    geometryEvents: false,
+    data: "{res}/geojson/pipeline.geojson",
+    style,
+  });
+  pipeline.addTo(groupGLLayer);
+}
 
 /**start**/
-let excavateAnalysis = null;
-const urlMap = {
+const textureMap = {
   ground: "{res}/images/ground.jpg",
   brick: "{res}/images/brick.png"
 };
 layer.once("loadtileset", (e) => {
   const extent = layer.getExtent(e.index);
   map.fitExtent(extent, 1, { animation: false });
-  const boundary = [
-    [108.95888623345706, 34.220502132776204],
-    [108.9582019833017, 34.21987192350153],
-    [108.95866479224173, 34.21879554904879],
-    [108.95976365662978, 34.21870809810403],
-    [108.96043811487289, 34.219454268264116],
-    [108.96030941797153, 34.2204038033789]
+  AddPipeLine();
+  currentBoundary = [
+    [108.95865940298586, 34.220313399352875, 28.80102335256866],
+    [108.95800903947134, 34.219513250141034, 19.39458248077016],
+    [108.9590190943693, 34.218511956616425, 34.85025747659524],
+    [108.96027856333137, 34.21884767081414, 11.344320208363127],
+    [108.96067915752451, 34.21973628032711, 29.715621078772948],
+    [108.96067997002967, 34.21974168369681, 29.741613094044347],
+    [108.95865940298586, 34.220313399352875, 28.80102335256866]
   ];
-  excavateAnalysis = new maptalks.ExcavateAnalysis({
-    boundary,
-    textureUrl: urlMap["ground"],
-    height: 5
-  }).addTo(groupGLLayer);
+  ExcavateAnalysis(currentBoundary, 0);
 });
 
 const vLayer = new maptalks.VectorLayer("vector", {
   enableAltitude: true
 }).addTo(map);
 
-let coordinates = [],
+let coordinates = [], currentBoundary = null, currentBottomTexture = null, currentSideTexture = null,
   first = true;
 const drawTool = new maptalks.DrawTool({
   mode: "LineString",
@@ -165,18 +199,47 @@ drawTool.on("drawend", () => {
   coordinates.push(coordinates[0]);
   new maptalks.LineString(coordinates, {
     symbol: {
-      lineColor: "#f00"
+      lineColor: "#aa0",
+      lineWidth: 1
     }
   }).addTo(vLayer);
-  excavateAnalysis.update("boundary", coordinates);
+  console.log(coordinates);
+  ExcavateAnalysis(coordinates, 0, currentBottomTexture, currentSideTexture);
+  currentBoundary = coordinates;
   coordinates = [];
 });
 
 function getPickedCoordinate(coordinate) {
-  const identifyData = groupGLLayer.identify(coordinate)[0];
+  const identifyData = groupGLLayer.identify(coordinate, { orderByCamera: true })[0];
   return (identifyData && identifyData.coordinate) || coordinate;
 }
 
+function ExcavateAnalysis(coordinates, height, bottomTexture, sideTexture) {
+  polygonLayer.clear();
+  let bottomCoords = [];
+  for (let i = 0; i < coordinates.length - 1; i++) {
+    const coord1 = coordinates[i], coord2 = coordinates[i + 1], coord3 = [coord2[0], coord2[1], height], coord4 = [coord1[0], coord1[1], height];
+    const extrudeCoordinates = [coord1, coord2, coord3, coord4, coord1];
+    bottomCoords[i] = [coordinates[i][0], coordinates[i][1], height];
+    new maptalks.Polygon(extrudeCoordinates, {
+      symbol: {
+        polygonFill: '#770',
+        polygonPatternFile: sideTexture
+      }
+    }).addTo(polygonLayer);
+  }
+  const idx = coordinates.length - 1;
+  bottomCoords[coordinates.length - 1] = [coordinates[idx][0], coordinates[idx][1], height];
+  const p = new maptalks.Polygon(bottomCoords, {
+    symbol: {
+      polygonFill: '#aa0',
+      polygonPatternFile: bottomTexture
+    }
+  }).addTo(polygonLayer);
+  const mask = new maptalks.ClipInsideMask(coordinates);
+  layer.setMask([mask]);
+}
+
 const gui = new mt.GUI();
 
 gui
@@ -199,15 +262,44 @@ gui
     step: 1
   })
   .onChange((value) => {
-    excavateAnalysis.update("height", value);
+    ExcavateAnalysis(currentBoundary, value, currentBottomTexture, currentSideTexture);
   });
 
 gui
   .add({
     type: "select",
-    label: "挖方纹理",
-    value: "ground",
+    label: "底面纹理",
+    value: 'null',
     options: [
+      {
+        label: '无纹理',
+        value: 'null'
+      },
+      {
+        label: "地面",
+        value: "ground"
+      },
+      {
+        label: "砖块",
+        value: "brick"
+      }
+    ]
+  })
+  .onChange((value) => {
+    currentBottomTexture = textureMap[value];
+    ExcavateAnalysis(currentBoundary, value, currentBottomTexture, currentSideTexture);
+  });
+
+  gui
+  .add({
+    type: "select",
+    label: "侧边纹理",
+    value: 'null',
+    options: [
+      {
+        label: '无纹理',
+        value: 'null'
+      },
       {
         label: "地面",
         value: "ground"
@@ -219,6 +311,7 @@ gui
     ]
   })
   .onChange((value) => {
-    excavateAnalysis.update("textureUrl", urlMap[value]);
+    currentSideTexture = textureMap[value];
+    ExcavateAnalysis(currentBoundary, value, currentBottomTexture, currentSideTexture);
   });
 /**end**/
diff --git a/public/codes/3d/spatial-analysis/excavate/index_cn.md b/public/codes/3d/spatial-analysis/excavate/index_cn.md
@@ -1,7 +0,0 @@
-#### ExcavateAnalysis 图层的参数说明如下
-
-| 属性       | 说明     | 类型   | 默认值 |
-| ---------- | -------- | ------ | ------ |
-| boundary   | 挖方范围 | array  | none   |
-| textureUrl | 挖方纹理 | string | none   |
-| height     | 挖方高度 | number | 0      |
diff --git a/public/codes/3d/spatial-analysis/excavate/index_en.md b/public/codes/3d/spatial-analysis/excavate/index_en.md
@@ -1,7 +0,0 @@
-#### ExcavateAnalysis layer params
-
-| Properties | Description       | Type   | Default |
-| ---------- | ----------------- | ------ | ------- |
-| boundary   | Excavate boundary | array  | none    |
-| textureUrl | Excavate texture‘s url  | string | none    |
-| height     | Excavate height   | number | 0       |
diff --git a/public/resources/geojson/pipeline.geojson b/public/resources/geojson/pipeline.geojson

Original file line number	Diff line number	Diff line change
`@@ -31,6 +31,7 @@ function createMap(mapDiv, center, zoom, pitch, dragRotatePitch, dragPitch) {`
`31`	`31`
`32`	`32`	`function create3DtilesLayer() {`
`33`	`33`	`const layer = new maptalks.Geo3DTilesLayer("3dtiles", {`
	`34`	`+ geometryEvents: true,`
`34`	`35`	`services: [`
`35`	`36`	`{`
`36`	`37`	`url: "http://resource.dvgis.cn/data/3dtiles/dayanta/tileset.json",`
Original file line number	Diff line number	Diff line change
`@@ -24,6 +24,7 @@ const map = new maptalks.Map("map", {`
`24`	`24`	`});`
`25`	`25`
`26`	`26`	`const layer = new maptalks.Geo3DTilesLayer("3dtiles", {`
	`27`	`+ geometryEvents: true,`
`27`	`28`	`services: [`
`28`	`29`	`{`
`29`	`30`	`url: "http://resource.dvgis.cn/data/3dtiles/dayanta/tileset.json",`