Picture of Timo R
Trying to use three.js in my component
by Timo R - Saturday, 24 September 2022, 7:22 PM
 

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?
 
Picture of Oliver Foster
Re: Trying to use three.js in my component
by Oliver Foster - Monday, 26 September 2022, 7:48 AM
 

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

Picture of Timo R
Re: Trying to use three.js in my component
by Timo R - Monday, 3 October 2022, 12:06 PM
 

Thanks, I got it working! :-)

Picture of Oliver Foster
Re: Trying to use three.js in my component
by Oliver Foster - Monday, 3 October 2022, 3:03 PM
 

Cool, I'm glad.