Video in the 3D View

Video in the 3D view is video set as the material or skin of plane nodes or other objects. It maps to the object and gives the appearance of existing in 3D space. An example of this can be seen in the video below.

Getting Video in the 3D View

  1. Import a video file into the Media Library. The following formats are supported for this purpose:

    • MP4, web-optimized, baseline or main profile, maximum resolution of 1920 pixels in either dimension
    • OGG Theora, no audio, .ogv extension

For technical reasons the video resolution of OGV videos must be a power of two in both dimensions, e.g. 128px, 256px etc. Due to limitations of mobile hardware it's recommended to keep video used as a texture to 256px by 256px or less.

  1. Drag the video into the Hierarchy to create a VideoTexture node with the video as the source material.

  2. With an existing plane in the Hierarchy selected, locate the materials property in the Properties panel and set it to the newly-created VideoTexture.

  1. Play the VideoTexture by dragging the VideoTexture node from the Hierarchy into a script and calling the start( ) function on it.


The example below shows the relevant code within the show script node.

Example:

var display_shown = symbol.controllers.display.elements.shown;
var display_hidden = symbol.controllers.display.elements.hidden;

// The VideoTexture node dragged in
var myVideo_ogv = symbol.nodes.myVideo_ogv;

parent.on("show", () => {

    // Make sure we start from fully hidden
    display_hidden.reset();

    // Move to the shown state
    display_shown.activate();

    // Play the video
    myVideo_ogv.start();

});

In the example above myVideo_ogv is the name of the VideoTexture node in the Hierarchy, this may differ in your project.

As with audio, VideoTexture nodes can be controlled from both timelines and scripts.

As audio is not supported in OGV videos imported into Studio, you will need to separately import and play your audio file. For more information on audio please see our Audio article.

More Information

zapcode branded_zapcode i