支持材质自定义

src/Utils.ts

@@ -1,5 +1,5 @@
 import { Object3D, Mesh } from "three";
-import { createTemplateBoard, DrawDimension, Viewer, selectMaterial } from ".";
+import { createTemplateBoard, DrawDimension, Viewer } from ".";
 
 function dispose(m: Object3D)
 {
@@ -21,7 +21,7 @@ export function LoadBoard(view: Viewer, data: any[], clear: boolean = true)
 
     if (data.length === 0) return;
     //加板
-    let { meshs, edgesa, relations } = createTemplateBoard(data);
+    let { meshs, edgesa, relations } = createTemplateBoard(data, view._Settings.boardMaterial);
 
     //加标注
     let dims = DrawDimension(meshs);

src/ViewSrc/index.ts

@@ -1,6 +1,6 @@
 // import { Color, Face3, MeshBasicMaterial, Object3D, Vector2, Vector3 } from "three";
 // import "./style.css";
-import { Vector3 } from "three";
+import { Color, MeshBasicMaterial, Vector3 } from "three";
 import { CameraControlState } from "../CameraControls";
 import { data } from "../data";
 import { GetBox } from "../GeUtils";
@@ -25,7 +25,17 @@ el.style.width = "80%";
 el.style.height = "80%";
 document.body.appendChild(el);
 
-let view = new Viewer(el);
+let view = new Viewer(el, (settings) =>
+{
+    settings.boardMaterial = new MeshBasicMaterial({
+        color: new Color(0.8, 0.8, 0.8),
+        polygonOffset: true,
+        polygonOffsetFactor: 1, // positive value pushes polygon further away
+        polygonOffsetUnits: 1,
+        transparent: true,
+        opacity: 0.5
+    });
+});
 
 //修改这个顺序 改变1 2 3 个触摸点时的触发状态.
 view.m_CameraCtrl.m_TouthTypeList = [CameraControlState.Rotate, CameraControlState.Scale, CameraControlState.Pan];

src/Viewer.ts

@@ -1,11 +1,18 @@
 
-import { Mesh, Raycaster, Scene, Vector3, WebGLRenderer, WebGLRendererParameters } from "three";
+import { Mesh, MeshBasicMaterial, Raycaster, Scene, Vector3, WebGLRenderer, WebGLRendererParameters } from "three";
 import { boardMaterial, CameraControls, PointPick, selectMaterial } from ".";
 import { CameraUpdate } from "./CameraUpdate";
 import { ColorMaterial } from "./ColorPalette";
 import { cZeroVec, GetBox, GetBoxArr } from "./GeUtils";
 import { PlaneExt } from "./PlaneExt";
 
+export class ViewerSettings
+{
+  boardMaterial: MeshBasicMaterial = boardMaterial;
+  selectMaterial: MeshBasicMaterial = selectMaterial;
+
+}
+
 export class Viewer
 {
   m_LookTarget: any;
@@ -20,13 +27,19 @@ export class Viewer
 
   m_Scene: Scene = new Scene();
 
+  _Settings = new ViewerSettings();
   /**
    * 
    * @param {HTMLElement} canvasContainer 可以传入一个div或者一个画布
    * @memberof Viewer
    */
-  constructor(canvasContainer: HTMLElement)
+  constructor(canvasContainer: HTMLElement, setupAction: (settings: ViewerSettings) => void = null)
   {
+    if (setupAction)
+    {
+      setupAction(this._Settings);
+    }
+
     this.m_DomEl = canvasContainer;
     this.initRender(canvasContainer);
     this.OnSize();
@@ -193,11 +206,11 @@ export class Viewer
   {
     let mesh = PointPick(this, x, y);
     if (this.oldMesh)
-      this.oldMesh.material = boardMaterial;
+      this.oldMesh.material = this._Settings.boardMaterial;
     if (mesh && mesh.material !== ColorMaterial.GetBasicMaterial(1))
     {
       this.oldMesh = mesh;
-      mesh.material = selectMaterial;
+      mesh.material = this._Settings.selectMaterial;
     }
     this.m_bNeedUpdate = true;
   }
@@ -207,7 +220,7 @@ export class Viewer
     {
       let meshId = blockMeshMap.get(dataID);
       if (this.oldMesh)
-        this.oldMesh.material = boardMaterial;
+        this.oldMesh.material = this._Settings.boardMaterial;
       this.m_Scene.children.forEach(obj =>
       {
         if (obj instanceof Mesh)
@@ -215,7 +228,7 @@ export class Viewer
           if (obj.id == meshId)
           {
             this.oldMesh = obj;
-            obj.material = selectMaterial;
+            obj.material = this._Settings.selectMaterial;
             this.m_bNeedUpdate = true;
           }
         }

src/createBoard.ts

@@ -1,7 +1,7 @@
-import { CylinderGeometry, Geometry, LineSegments, Mesh, Shape, Vector2, Vector3, Matrix4, ExtrudeGeometry, EdgesGeometry } from 'three';
+import { CylinderGeometry, Geometry, LineSegments, Mesh, Shape, Vector2, Vector3, Matrix4, ExtrudeGeometry, EdgesGeometry, MeshBasicMaterial } from 'three';
 import { ColorMaterial } from './ColorPalette';
 import { equalv3, polar } from './GeUtils';
-import { boardMaterial, edgeMaterial } from './Material';
+import { edgeMaterial } from './Material';
 import { RotateUVs } from './RotateUV';
 import { ThreeBSP } from './ThreeCSG';
 //解析二维圆弧类.
@@ -77,7 +77,7 @@ export function getVec(data: object): Vector3
 }
 
 //创建板件 暂时这么写
-export function createBoard(boardData: object)
+export function createBoard(boardData: object, material: MeshBasicMaterial)
 {
     let pts: Vector2[] = [];
     let buls: number[] = [];
@@ -151,7 +151,7 @@ export function createBoard(boardData: object)
 
         if (boardData["SubBoardLocal"])
         {
-            let subBoardList = boardData["SubBoardLocal"].map(d => createBoard(d));
+            let subBoardList = boardData["SubBoardLocal"].map(d => createBoard(d, material));
             for (let br of subBoardList)
             {
                 edges.push(...br.edges);
@@ -190,7 +190,7 @@ export function createBoard(boardData: object)
     if (boardData["BoardName"] === "地脚线")
         RotateUVs(ext);
 
-    let mesh = new Mesh(ext, boardMaterial);
+    let mesh = new Mesh(ext, material);
     mesh.userData = ZD;
     edges.forEach(e => e.userData = ZD);
     return { mesh, edges };
@@ -201,7 +201,7 @@ function checkObjectArray(obj: any, key: string)
     return obj[key] && obj[key].length > 0;
 }
 
-export function createTemplateBoard(brDataList: any[])
+export function createTemplateBoard(brDataList: any[], material: MeshBasicMaterial)
 {
     let meshs = [];
     let edgesa = [];
@@ -212,7 +212,7 @@ export function createTemplateBoard(brDataList: any[])
     };
     for (let d of brDataList)
     {
-        let { mesh, edges } = createBoard(d);
+        let { mesh, edges } = createBoard(d, material);
         meshs.push(mesh);
         edgesa.push(...edges);