Home Try Online Gallery Docs GitHub

Prerequisites

These prerequisites apply to browser-based MorphCharts client pages.

WebGPU

The WebGPU renderer requires a browser that supports WebGPU. As of early 2026, this includes recent versions of Chrome, Edge, and Firefox.

Secure Context

WebGPU requires a secure context (https:// or localhost), so your page must be served from a local web server — it won't work opened directly as a file.

Local Web Server

The simplest option is to save your page as index.html, then run one of the following from the same directory:

npx serve

This requires Node.js.

Alternatively, if you have Python installed:

python -m http.server

Then open http://localhost:3000 (or the port shown in your terminal) in your browser.

ES Modules

MorphCharts is published as ES modules. Use an import map to map bare specifiers to their URLs, for example:

<script type="importmap">
{
    "imports": {
        "core": "https://microsoft.github.io/morphcharts/lib/morphcharts-core.js",
        "spec": "https://microsoft.github.io/morphcharts/lib/morphcharts-spec.js",
        "webgpuraytrace": "https://microsoft.github.io/morphcharts/lib/morphcharts-webgpuraytrace.js"
    }
}
</script>
Module Description
core Core library — contains fundamental data structures and utilities
spec Spec parser — turns a JSON spec into a scene
webgpuraytrace WebGPU renderer — draws the scene

Note that the core module is required even if you don't use it directly, since the other modules depend on it.