How-To Get Started with rti.js

Learn how to embedd interactive Authentica visualizations with rti.js on any webpage.

By folowing this guide, you will create a viewer similar to this example viewer.

Preparation

  • Export your scene from Authentica Creator using the 'Export for Web' button.
    This will produce a folder containing all configuration and data files you need for dispaying your Authentica visualizations on the web.
  • Download the newest version of the rti.js library from here, and unpack the .zip file.
  • Upload both the data folder and the rti.js library to your HTTP server.

Minimal HTML example

      <!DOCTYPE html>
<html>
<head>

  <script src="/libs/rti.js/rti.v0.56.1.min.js"></script>

</head>
<body>

  <div id="viewerContainer" style="width: 400px; height: 400px;"></div>

  <script>

    var viewer = new RTI.RTIViewer( document.getElementById("viewerContainer") );

    viewer.loadConfig(
      "/data/myWebExport/fullConfig.json",
      function() {
        console.log("Success: loaded and applied configuration.");
        viewer.startRendering();
      },
      function(message) {
        console.log("ERROR: Could not load or set configuration. " + message);
      }
    );

  </script>

</body>
</html>