Baike.dev
All toolsOnline toolsAI codingTrendingOpen sourceNewsSubmit
Log in
< Back to tools
M

model-viewer

> 编程语言
Open source

3D Model Viewer supporting glTF and 3D Gaussian Splats

697 stars0 likes0 views
WebsiteGitHub

About

3D Model Viewer supporting glTF and 3D Gaussian Splats

PlayCanvas Model Viewer

| User Manual | API Reference | Blog | Forum |

The PlayCanvas glTF scene viewer is blazingly fast and 100% compliant with the glTF 2.0 spec.

You can find a live version at:

https://playcanvas.com/model-viewer

Viewing Scenes

The viewer can load any glTF 2.0 scene. Embedded glTF and binary glTF (GLB) can be dragged directly into the 3D view. To load an unpacked glTF scene, drag its parent folder into the 3D view.

You can also drag and drop images into the 3D view to set a background. Options are:

  • Single file images are treated as equirectangular projections. Supported formats are PNG, JPG and HDR. Find high quality HDR images at HDRHaven.
  • Six images are treated as cube map faces. Naming should be one of the following 5 forms, where each face name below should be incorporated in the overall filename like name_posx.png for example:
Face 0 Face 1 Face 2 Face 3 Face 4 Face 5
posx negx posy negy posz negz
px nx py ny pz nz
right left up down front back
right left top bottom forward backward
0 1 2 3 4 5

Supported URL Parameters

Some URL query parameters are available to override certain aspects of the viewer:

Parameter Description Example
load/assetUrl Specify URL to a glTF scene to load ?load=URL
cameraPosition Override the initial camera position ?cameraPosition=0,0,20

How to build

Ensure you have Node.js installed (v22.22+). Then, from a command prompt, run:

bash
npm install
npm run build

This will invoke Vite and esbuild and output the built viewer to the dist folder. To rebuild the viewer on saving any source file, do:

bash
npm run watch

How to run

Run:

bash
npm run serve

Open a browser and navigate to http://localhost:3000.

Development

Run:

bash
npm run develop

Open a browser and navigate to http://localhost:3000.

N.B. To load local models run npx server --cors in the directory containing the model (disables CORS).

Library integration testing

The Model Viewer is built on the following open source libraries:

Library Details
PlayCanvas Engine Powers the Editor's 3D View and Launch Page
Observer Data binding and history
PCUI Front-end component library

To test the integration of these libraries use npm link. Follow these steps:

  1. Create a global link from source

    bash
    cd 
npm link

  2. Create a link to the global link

    bash
    cd model-viewer
npm link

Issues· 0 open

View all issuesOpen on GitHub

No open issues yet, or sync has not completed.

> Tags

TypeScript3d-gaussian-splattinggaussian-splattinggltfjavascript

No comments yet. Be the first to share.

> Details

PublishedAug 1, 2026
UpdatedSep 17, 2026
Category编程语言
PricingOpen source

> Related tools

T
TypeScript
JavaScript 的超集，为前端与全栈提供静态类型
P
Python
通用编程语言，广泛用于 Web、数据与 AI
G
Go
Google 推出的简洁高效系统语言