[Solved] Making a 3D globe


The problem is that your fiddle is set to run onload, and you are setting window.onload so the code is never running because the onload has already ocurred.

You should debug it on your own before asking a question. I’ve updated the fiddle so that the WebGL code is actually running.

However, the code is having Cross Domain issues accessing earth.jpg. That is a separate question that you can create a new post for (after you do your own debugging). I would start with trying to run the code on your local server, and downloading the image locally.

THREE.WebGLRenderer: Texture is not power of two. Texture.minFilter
should be set to THREE.NearestFilter or THREE.LinearFilter. https://joshcarllewis.com/static/articles/html5-3d-canvas-tutorial/earth.jpg)

DOMException: Failed to execute ‘texImage2D’ on
‘WebGLRenderingContext’: The cross-origin image at
https://joshcarllewis.com/static/articles/html5-3d-canvas-tutorial/earth.jpg
may not be loaded.(…)texImage2D @ three.js:25518uploadTexture @

solved Making a 3D globe