<div id="container"></div>
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

div#container {
    height: 100%;
}
var config = {
    "story":
    {
        "uid": "simpliest-story",
        "name": "Simpliest Story",
        "slug": "simpliest-story",
        "description": "This is the simpliest story ever",
        "default": "scene-0",

        "scenes":
        [
            {
                "uid": "scene-0",
                "name": "First scene",
                "slug": "first-scene",
                "description": "This is the first and only scene",

                "media":
                {
                    "uid": "media-0",
                    "type": "image",

                    "source":
                    {
                        "format": "equi",
                        "url": "https://cdn.forgejs.org/samples/common/panos/01-forest.jpg"
                    }
                }
            }
        ]
    }
};

// Create a viewer
var viewer = new FORGE.Viewer("container", config);
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://releases.forgejs.org/latest/samples/lib/three.js/three.custom.min.js
  2. https://releases.forgejs.org/latest/samples/lib/hammer.js/hammer.min.js
  3. https://releases.forgejs.org/latest/samples/lib/forge/forge.min.js