Autodesk forge 在forge viewer中，我可以添加新的THREE.Object3D，但我可以'；不要在查看器中选择它。

在Forge Viewer中，我编写了一个自定义处理程序。它有一个绑定的双击事件，当它与该事件一起激发时，该事件将计算被单击的项目

const hitTest = this.viewer.clientToWorld(event.canvasX, event.canvasY, true);

对于普通对象/网格/材质，该操作正常，并返回hitTest.dbId，加上一个hitTest.point对象指示我在三维空间中单击的位置。我使用该位置创建材质、网格和对象，然后添加到场景中。（跳过了几个小步骤）

所有这些都很有效。球体将添加到我的模型中。（它是黑色的，我仍然不明白为什么…）但最大的问题是我不能点击球体。单击它可以选择模型中的基础对象，通常是墙或楼板

---

我是否需要使用光线跟踪方法来获取场景中的对象？或者对象/网格/材质是否具有可单击的属性？查看器更新

此时，您必须创建一个继承Autodesk.Viewing.ToolInterface的自有工具，并将您的单击逻辑放入

handleSingleClick

功能中。以下是该案例的一个示例：

自定义工具：

class CustomTool extends Autodesk.Viewing.ToolInterface {
    constructor( viewer ) {
        super();
        this._viewer = viewer;
        this._active = false;
        this._names = [ 'CustomTool' ];
    }

    get viewer() {
        return this._viewer;
    }

    isActive() {
        return this._active;
    }

    handleSingleClick( event, button ) {
        const _viewer = this.viewer;
        const intersectObjects = (function () {
            const pointerVector = new THREE.Vector3();
            const pointerDir = new THREE.Vector3();
            const ray = new THREE.Raycaster();
            const camera = _viewer.impl.camera;

            return function(pointer, objects, recursive) {
                const rect = _viewer.impl.canvas.getBoundingClientRect();
                const x = (( pointer.clientX - rect.left) / rect.width ) * 2 - 1;
                const y = - (( pointer.clientY - rect.top) / rect.height ) * 2 + 1;

                if (camera.isPerspective) {
                    pointerVector.set( x, y, 0.5 );
                    pointerVector.unproject( camera );
                    ray.set( camera.position, pointerVector.sub( camera.position ).normalize() );
                } else {
                    pointerVector.set( x, y, -1 );
                    pointerVector.unproject( camera );
                    pointerDir.set( 0, 0, -1 );
                    ray.set( pointerVector, pointerDir.transformDirection( camera.matrixWorld ) );
                }

                const intersections = ray.intersectObjects( objects, recursive );
                return intersections[0] ? intersections[0] : null;
            };
        })();

        const pointer = event.pointers ? event.pointers[ 0 ] : event;
        // Intersect objects in the scene
        const result = intersectObjects( pointer, _viewer.impl.scene.children );

        if( result && result.object ) {
            const mesh = result.object;
            // Change object color
            let curColor = mesh.material.color;
            curColor = ( curColor.getHex() == 0xff0000 ? 0x00ff00 : 0xff0000 );
            mesh.material.color.setHex( curColor );

            // Refreah viewport
            this.viewer.impl.invalidate( false, true, true );
        }

        return false;
    }
}

class CustomToolExtension extends Autodesk.Viewing.Extension {
    constructor( viewer, options ) {
        super( viewer, options );
        this._tool = undefined;
    }

    load() {
        // Construct an custom Tool instance
        this._tool = new CustomTool( this.viewer );
        // Register custom Tool into viewer.toolController
        this.viewer.toolController.registerTool( this._tool );
        // Activate the Tool
        this.viewer.toolController.activateTool( 'CustomTool' );

        return true;
    }

    unload() {
        // If tool has been activated, deactivate the tool.
        if( this._tool.isActive() ) {
            this.viewer.toolController.deactivateTool( 'CustomTool' );
        }
       // Deregister custom Tool 
        this.viewer.toolController.deregisterTool( this._tool );

        return true;
    }
}

Autodesk.Viewing.theExtensionManager.registerExtension( 'Autodesk.ADN.Sample.CustomToolExtension', CustomToolExtension );

查看器扩展管理此自定义工具：

class CustomTool extends Autodesk.Viewing.ToolInterface {
    constructor( viewer ) {
        super();
        this._viewer = viewer;
        this._active = false;
        this._names = [ 'CustomTool' ];
    }

    get viewer() {
        return this._viewer;
    }

    isActive() {
        return this._active;
    }

    handleSingleClick( event, button ) {
        const _viewer = this.viewer;
        const intersectObjects = (function () {
            const pointerVector = new THREE.Vector3();
            const pointerDir = new THREE.Vector3();
            const ray = new THREE.Raycaster();
            const camera = _viewer.impl.camera;

            return function(pointer, objects, recursive) {
                const rect = _viewer.impl.canvas.getBoundingClientRect();
                const x = (( pointer.clientX - rect.left) / rect.width ) * 2 - 1;
                const y = - (( pointer.clientY - rect.top) / rect.height ) * 2 + 1;

                if (camera.isPerspective) {
                    pointerVector.set( x, y, 0.5 );
                    pointerVector.unproject( camera );
                    ray.set( camera.position, pointerVector.sub( camera.position ).normalize() );
                } else {
                    pointerVector.set( x, y, -1 );
                    pointerVector.unproject( camera );
                    pointerDir.set( 0, 0, -1 );
                    ray.set( pointerVector, pointerDir.transformDirection( camera.matrixWorld ) );
                }

                const intersections = ray.intersectObjects( objects, recursive );
                return intersections[0] ? intersections[0] : null;
            };
        })();

        const pointer = event.pointers ? event.pointers[ 0 ] : event;
        // Intersect objects in the scene
        const result = intersectObjects( pointer, _viewer.impl.scene.children );

        if( result && result.object ) {
            const mesh = result.object;
            // Change object color
            let curColor = mesh.material.color;
            curColor = ( curColor.getHex() == 0xff0000 ? 0x00ff00 : 0xff0000 );
            mesh.material.color.setHex( curColor );

            // Refreah viewport
            this.viewer.impl.invalidate( false, true, true );
        }

        return false;
    }
}

class CustomToolExtension extends Autodesk.Viewing.Extension {
    constructor( viewer, options ) {
        super( viewer, options );
        this._tool = undefined;
    }

    load() {
        // Construct an custom Tool instance
        this._tool = new CustomTool( this.viewer );
        // Register custom Tool into viewer.toolController
        this.viewer.toolController.registerTool( this._tool );
        // Activate the Tool
        this.viewer.toolController.activateTool( 'CustomTool' );

        return true;
    }

    unload() {
        // If tool has been activated, deactivate the tool.
        if( this._tool.isActive() ) {
            this.viewer.toolController.deactivateTool( 'CustomTool' );
        }
       // Deregister custom Tool 
        this.viewer.toolController.deregisterTool( this._tool );

        return true;
    }
}

Autodesk.Viewing.theExtensionManager.registerExtension( 'Autodesk.ADN.Sample.CustomToolExtension', CustomToolExtension );

---

希望获得此帮助。

您能告诉我CustomTool类是如何将Autodesk.Viewing.ToolInterface扩展为接口的吗？在JavaScript中，没有接口，

Autodesk.Viewing.ToolInterface

是预定义的对象（），作为查看器工具的基类。您可以直接创建类似于

CustomTool

的内容，而不扩展

Autodesk.Viewing.ToolInterface