The WebGL Globe - help - part 1 -

Hi guys , I’m noob to webgl /js /three.js and most of the coding - I know some basic html and css , I want to make a project and use this webgl globe proj
DEMO
the problem is It doesn’t work for me and don’t know why - I can see WebGl content I test my browser and is ok ,

[Google Chrome is up to date
Version 77.0.3865.90 (Official Build) (64-bit)]

So I downloaded the proj - open the index.html and I don’t see the globe only black - when I inspect the page it say
error1
error2
Also when I try to open the link to js in that folder it say is unable to do so , but the files are there - and I can open each one of them in VS

I’ve tried other examples in Three.js and webgl and works fine !

Any ideas ?, thank you ! , or if u know any tutorial that works will be just fine ! - but I want this model to work with //

This problem is not directly related to THREE.js. Are you creating a server or just opening the HTML file? index.html uses absolute paths such as:

  <script type="text/javascript" src="/globe/third-party/Detector.js"></script>

Even though you can find it in your project, the script is not present at the above path.

Option 1: Host the files in such a way that Detector.js is accessible from that path. For example, you could use any simple HTTP filesystem server such as Python’s:

git clone https://github.com/dataarts/webgl-globe.git
cd webgl-globe/
python3 -m http.server

And then go to http://localhost:8000/globe/

Option 2: change the paths in index.html to reflect your filesystem. If you’re just opening index.html in the browser, this probably means making them relative (e.g. “./third-party/Detector.js”).

1 Like

Thank you ianw for your time , that made a lot of sense ! - I used apache srv and works fine !