![Version](https://img.shields.io/badge/version-1.0.3-blue.svg?cacheSeconds=2592000) [![Documentation](https://img.shields.io/badge/documentation-yes-brightgreen.svg)](https://docs.onirix.com/modules/onirix-node-inspector) [![Twitter: onirix](https://img.shields.io/twitter/follow/onirix.svg?style=social)](https://twitter.com/onirix) # OnirixNodeInspector `OnirixNodeInspector` is a JavaScript library designed to interact with the Onirix Embed SDK. It provides functionality to load, inspect, and highlight nodes in a 3D scene, display associated data sheets for selected nodes, and manage interactions with nodes in the scene. To learn more about this module visit our [documentation](https://docs.onirix.com/modules/onirix-node-inspector). ## Install You can install the library via npm: ```sh npm install @onirix/node-inspector ``` Alternatively, include the dependency in the HTML tag: ```html ``` Or use it as an ES module: ```js import OnirixNodeInspector from "https://cdn.jsdelivr.net/npm/@onirix/node-inspector@1.0.3/+esm"; ``` ## Usage ### Initialization To initialize the OnirixNodeInspector module, create a new instance of the class and pass the Onirix EmbedSDK instance. ```js import OnirixEmbedSDK from "https://cdn.jsdelivr.net/npm/@onirix/embed-sdk@1.17.1/+esm"; import OnirixNodeInspector from "https://cdn.jsdelivr.net/npm/@onirix/node-inspector@1.0.3/+esm"; const embedSdk = new OnirixEmbedSDK(); embedSdk.connect(); const nodeInspector = new OnirixNodeInspector(embedSdk); const nodeInspector = new OnirixNodeInspector(embedSdk, { enableHighlight: true, highlightParams: { type: "box", border: { enable: true } }, showNodeData: true, onlyWithDatasheets: false, }); ``` Onirix Node Inspector offers you several options to adapt its use to your needs. You can configure the operation through a second parameter in the module builder. These are the available options: - `embedSdk` (required): Instance of the Onirix Embed SDK. - `params` (optional): Configuration parameters for the inspector: - `enableHighlight` (default: `true`): Whether to enable node highlighting. - `dataStructure`(default: `ox-node-inspector`): Name of the datasheet data structure. - `highlightParams` (default: `{type: "box", border: {enable: false}}`): Parameters for node highlighting. - `showNodeData` (default: `true`): Whether to show node data in the UI panel when a node is selected. - `onlyWithDatasheets` (default: `false`): Whether to only include nodes with associated datasheets. - `onNodeSelected` (default: `null`): Callback function to execute when a node is selected. ```js import OnirixEmbedSDK from "https://cdn.jsdelivr.net/npm/@onirix/embed-sdk@1.17.1/+esm"; import OnirixNodeInspector from "https://cdn.jsdelivr.net/npm/@onirix/node-inspector@1.0.3/+esm"; const embedSdk = new OnirixEmbedSDK(); embedSdk.connect(); const params = { 'highlightParams': { 'color': '#F00' }, 'dataStructure': 'my-structure', 'onlyWithDatasheets': true } const nodeInspector = new OnirixNodeInspector(embedSdk, params); ``` ## OnirixNodeInspector Class ### Methods #### `setHighlightingParams(enable, params)` Configures the highlighting parameters for nodes. More information about the highlighting options in the [EmbedSDK documentation](https://docs.onirix.com/onirix-sdk/embed-sdk#enablehighlightnodes-enab). - **Parameters:** - `enable` (boolean): Whether to enable node highlighting. - `params` (object): Highlighting parameters, such as type and border settings. - **Example:** ```js nodeInspector.setHighlightingParams(true, { type: "box", border: { enable: true } }); ``` ### Example ```js import OnirixEmbedSDK from "https://cdn.jsdelivr.net/npm/@onirix/embed-sdk@1.17.1/+esm"; import OnirixNodeInspector from "https://cdn.jsdelivr.net/npm/@onirix/node-inspector@1.0.3/+esm"; const embedSdk = new OnirixEmbedSDK(); embedSdk.connect(); const nodeInspector = new OnirixNodeInspector(embedSdk); // Configure highlighting nodeInspector.setHighlightingParams(true, { type: "box", border: { enable: true } }); ``` ## Author 👤 **Onirix** * Website: [www.onirix.com](www.onirix.com) * Twitter: [@onirix](https://twitter.com/onirix) * Github: [@onirix-ar](https://github.com/onirix-ar) * LinkedIn: [@onirixar](https://linkedin.com/in/onirixar)