feat(SDK): 修改Viewer初始化配置中Edit的数据结构

This commit is contained in:
ErSan 2025-11-05 00:01:35 +08:00
parent d90331083e
commit 88d6076a83
6 changed files with 84 additions and 30 deletions

View File

@ -18,7 +18,7 @@ import {
TilesManage, TilesManage,
} from "./modules"; } from "./modules";
import {ShaderMaterialManager} from "@/core/shaderMaterial/ShaderMaterialManager"; import {ShaderMaterialManager} from "@/core/shaderMaterial/ShaderMaterialManager";
import {deepAssign, getMousePosition, isEmptyObject, isNil,createDivContainer} from "@/utils"; import {deepAssign, deepEqual, getMousePosition, isEmptyObject, isNil, createDivContainer} from "@/utils";
import {useDispatchSignal} from "@/hooks"; import {useDispatchSignal} from "@/hooks";
import { import {
AddObjectCommand, AddObjectCommand,
@ -184,7 +184,6 @@ export default class Viewer extends THREE.EventDispatcher<ViewerEventMap> {
public pmremGenerator: THREE.PMREMGenerator | null = null; public pmremGenerator: THREE.PMREMGenerator | null = null;
public pathtracer: ViewerPathTracer | undefined; public pathtracer: ViewerPathTracer | undefined;
public modules: ViewerModules; public modules: ViewerModules;
public showSceneHelpers: boolean = true;
public css2DRenderer: CSS2DRenderer = new CSS2DRenderer(); public css2DRenderer: CSS2DRenderer = new CSS2DRenderer();
public css3DRenderer: CSS3DRenderer = new CSS3DRenderer(); public css3DRenderer: CSS3DRenderer = new CSS3DRenderer();
@ -251,20 +250,26 @@ export default class Viewer extends THREE.EventDispatcher<ViewerEventMap> {
} }
/** /**
* *
*/ */
get enableEdit(): boolean { get edit(): IViewerEdit {
return this.options.enableEdit || false; return this.options.edit as IViewerEdit;
} }
/** /**
* *
* @param enable * @param config
*/ */
set enableEdit(enable: boolean) { set edit(config: IViewerEdit) {
if (enable === this.enableEdit) return; if(!config) return;
if (deepEqual(config,this.options.edit)) return;
deepAssign(this.options.edit,config);
if (this.options.edit?.gizmo) {
if(this.modules.transformControls) return;
if (enable) {
let objectPositionOnDown = new THREE.Vector3(); let objectPositionOnDown = new THREE.Vector3();
let objectRotationOnDown = new THREE.Euler(); let objectRotationOnDown = new THREE.Euler();
let objectScaleOnDown = new THREE.Vector3(); let objectScaleOnDown = new THREE.Vector3();
@ -327,6 +332,10 @@ export default class Viewer extends THREE.EventDispatcher<ViewerEventMap> {
this.modules.transformControls = undefined; this.modules.transformControls = undefined;
} }
// TODO 处理 this.options.edit?.helpers以兼容只显示gizmo不显示helpers的情况
this.render();
} }
/** /**
@ -492,7 +501,7 @@ export default class Viewer extends THREE.EventDispatcher<ViewerEventMap> {
tilesManage: new TilesManage(this.scene,this.camera,this.renderer), tilesManage: new TilesManage(this.scene,this.camera,this.renderer),
} }
if (this.enableEdit) { if (this.edit?.enabled) {
let objectPositionOnDown = new THREE.Vector3(); let objectPositionOnDown = new THREE.Vector3();
let objectRotationOnDown = new THREE.Euler(); let objectRotationOnDown = new THREE.Euler();
let objectScaleOnDown = new THREE.Vector3(); let objectScaleOnDown = new THREE.Vector3();
@ -1091,7 +1100,7 @@ export default class Viewer extends THREE.EventDispatcher<ViewerEventMap> {
// 非默认相机不渲染辅助 // 非默认相机不渲染辅助
if (this.camera === App.viewportCamera) { if (this.camera === App.viewportCamera) {
if (this.showSceneHelpers) this.renderer.render(this.sceneHelpers, this.camera); if (this.options.edit?.enabled) this.renderer.render(this.sceneHelpers, this.camera);
} }
// css2d 在sceneHelpers内 // css2d 在sceneHelpers内

View File

@ -3,8 +3,15 @@ export const ViewerOptions = (): IViewerSetting => ({
container: undefined, container: undefined,
// 场景背景及环境贴图 // 场景背景及环境贴图
hdr: undefined, hdr: undefined,
// 是否启用编辑模式 // 编辑模式
enableEdit: false, edit: {
// 是否启用
enabled: false,
// 是否显示辅助线
helpers: true,
// 是否现实gizmo三坐标轴
gizmo: true
},
// 是否启用脚本,自动运行脚本 // 是否启用脚本,自动运行脚本
enableScript: true, enableScript: true,
// 请求相关 // 请求相关
@ -13,6 +20,7 @@ export const ViewerOptions = (): IViewerSetting => ({
}, },
// 场景内网格 // 场景内网格
grid:{ grid:{
// 是否启用
enabled: true, enabled: true,
// 网格颜色 // 网格颜色
color: 0x999999, color: 0x999999,

View File

@ -49,7 +49,6 @@ export class Signals {
useAddSignal("sceneResize", this.sceneResize.bind(this)); useAddSignal("sceneResize", this.sceneResize.bind(this));
useAddSignal("showGridChanged", this.showGridChanged.bind(this)); useAddSignal("showGridChanged", this.showGridChanged.bind(this));
useAddSignal("showHelpersChanged", this.showHelpersChanged.bind(this));
useAddSignal("scriptAdded",this.scriptAdded.bind(this)); useAddSignal("scriptAdded",this.scriptAdded.bind(this));
useAddSignal("scriptRemoved",this.scriptRemoved.bind(this)); useAddSignal("scriptRemoved",this.scriptRemoved.bind(this));
@ -454,19 +453,6 @@ export class Signals {
this.render(); this.render();
} }
/**
* 线
* @param showHelpers
*/
showHelpersChanged(showHelpers:boolean){
this.viewer.showSceneHelpers = showHelpers;
if(this.viewer.modules.transformControls){
this.viewer.modules.transformControls.enabled = showHelpers;
}
this.render();
}
/** /**
* *
*/ */

View File

@ -17,3 +17,49 @@ export function deepAssign(target, source) {
} }
} }
} }
/**
*
* @param {any} a
* @param {any} b
* @returns {boolean}
*/
export function deepEqual(a, b) {
// 引用相同
if (a === b) return true;
// 排除 null
if (a === null || b === null) return false;
// 类型不同
if (typeof a !== typeof b) return false;
// 处理日期对象
if (a instanceof Date && b instanceof Date) {
return a.getTime() === b.getTime();
}
// 处理数组
if (Array.isArray(a) && Array.isArray(b)) {
if (a.length !== b.length) return false;
for (let i = 0; i < a.length; i++) {
if (!deepEqual(a[i], b[i])) return false;
}
return true;
}
// 处理对象
if (typeof a === 'object' && typeof b === 'object') {
const keysA = Object.keys(a);
const keysB = Object.keys(b);
if (keysA.length !== keysB.length) return false;
for (let key of keysA) {
if (!Object.prototype.hasOwnProperty.call(b, key)) return false;
if (!deepEqual(a[key], b[key])) return false;
}
return true;
}
// 其他基本类型
return false;
}

View File

@ -78,7 +78,6 @@ const appSignals: SignalRegister = {
scriptRemoved: new Signal(), scriptRemoved: new Signal(),
showGridChanged: new Signal(), showGridChanged: new Signal(),
showHelpersChanged: new Signal(),
historyChanged: new Signal(), historyChanged: new Signal(),
// 场景主相机变更 // 场景主相机变更

View File

@ -1,3 +1,9 @@
declare interface IViewerEdit {
enabled:boolean;
helpers: boolean;
gizmo:boolean;
}
declare interface IViewerGrid { declare interface IViewerGrid {
enabled:boolean; enabled:boolean;
color: number | string; color: number | string;
@ -25,7 +31,7 @@ declare interface IViewerRequest {
declare interface IViewerSetting { declare interface IViewerSetting {
container?: HTMLElement; container?: HTMLElement;
hdr?: string; hdr?: string;
enableEdit?: boolean; edit?: IViewerEdit;
enableScript?: boolean; enableScript?: boolean;
request?:IViewerRequest; request?:IViewerRequest;
grid:IViewerGrid; grid:IViewerGrid;