Adapt Learning Community: Trying to use three.js in my component

Hi,

I want to include three.js in my component but have problems loading it.

When I use this on a default html page (non adapt) it works fine:

var head = document.getElementsByTagName('head')[0];

var script = document.createElement('script');

script.src = 'https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js';

head.appendChild(script);

The THREE object is then available.

When I use this in my adapt component or in the dev console after the adapt course has loaded, it is not available. Surely this is because of the way it gets loaded. Maybe there is a conflict with the adapt mechanisms to load external js files / modules, but I am not so deep into it and don't know what the right way would be. Maybe someone can give me a hint?

Download the file, put it in your libraries folder and then

import three from 'libraries/three.min';

Or, if you're using require:

define([ 'libraries/three.min' ], function(three) {});

See media https://github.com/adaptlearning/adapt-contrib-media/blob/master/js/mediaView.js#L6 https://github.com/adaptlearning/adapt-contrib-media/tree/master/libraries