The Cognitive3D SDK for Javascript and WebXR

Welcome! This SDK allows you to integrate your Javascript and WebXR Applications with Cognitive3D, which provides analytics and insights about your VR/AR/MR project. In addition, Cognitive3D empowers you to take actions that will improve users' engagement with your experience.

Requirement(s)

Node.js version 20 or higher. We currently require a version of Node.js of 20 or higher for this SDK. If this doesn't match your needs, let us know.

🔧 Installation

You can add Cognitive3D to your javascript project in two ways.

Option 1. Install from NPM

Inside your javascript project's terminal, run the following command

npm install @cognitive3d/analytics

Option 2. Install from source code

If you want the entire source code, whether that be to run tests, make modifications, you can clone this repository by

A) Clone the repo

git clone https://github.com/CognitiveVR/c3d-sdk-webxr.git
cd c3d-sdk-webxr

B) Install the dependencies

npm install

C) Build the sdk

This will transpile the SDK src files into a /lib folder

npm run build

D) Install the local sdk to your project

Navigate to your projects directory, and then run the following command

npm install /pathTo/c3d-sdk-webxr

📂 Project Structure

Here's an overview of the key files and directories in the project:

c3d-sdk-webxr/
├── src/                    # Contains the source code for the SDK.
   ├── adapters/            # Modules for integrating with Three.js, Babylon.js, PlayCanvas, etc.
   └── utils/               # Utility modules for framerate tracking, HMD orientation, etc.
├── __tests__/              # Contains all the Jest tests for the SDK.
├── assets/                 # Contains images and logos used in the readme.
├── lib/                    # Generated by the build process, contains the transpiled SDK files (UMD, ESM, CJS).
└── settings.js             # Configuration file for the SDK tests (API key, scene info).

Usage

The SDK is designed to be flexible and can be integrated into various JavaScript projects. The build process creates multiple module formats in the /lib folder to support different environments.

index.umd.js (Universal Module Definition): One-size-fits-all for direct use in browsers. It's designed to be dropped into a <script> tag on a webpage.
index.esm.js (ES Module): The modern module standard for JavaScript. It's used by default in most web bundlers and modern Node.js.
index.cjs.js (CommonJS): The module format for older Node.js environments.

The documentation explains how to integrate the SDK, track your users' experience and how to export your scene to view on Cognitive3D.com.

Go to the Docs

Sample Projects

For more detailed examples and complete project integrations (Playcanvas, ThreeJS, Wonderland Engine), please see our sample applications repository at: https://github.com/CognitiveVR/c3d-webxr-sample-apps