2 years ago

#1576

test-img

afp_2008

Nothing is displayed when loading my WebGL2 html file

I am reading a book on WebGL2. I am new to both HTML and WebGL and am trying to educate myself.

I have a problem with loading one of the examples of the book, which is posted here.

For convenience, I have put the first few lines of the HTML code in below.

<html>
<head>
  <title>Real-Time 3D Graphics with WebGL2</title>
  <link rel="shortcut icon" type="image/png" href="/common/images/favicon.png" />

  <!-- libraries -->
  <link rel="stylesheet" href="/common/lib/normalize.css">
  <script type="text/javascript" src="/common/lib/dat.gui.js"></script>
  <script type="text/javascript" src="/common/lib/gl-matrix.js"></script>

  <!-- modules -->
  <script type="text/javascript" src="/common/js/utils.js"></script>
  <script type="text/javascript" src="/common/js/EventEmitter.js"></script>
  <script type="text/javascript" src="/common/js/Camera.js"></script>
  <script type="text/javascript" src="/common/js/Clock.js"></script>
  <script type="text/javascript" src="/common/js/Controls.js"></script>
  <script type="text/javascript" src="/common/js/Floor.js"></script>
  <script type="text/javascript" src="/common/js/Light.js"></script>
  <script type="text/javascript" src="/common/js/Program.js"></script>
  <script type="text/javascript" src="/common/js/Scene.js"></script>
  <script type="text/javascript" src="/common/js/Texture.js"></script>
  <script type="text/javascript" src="/common/js/Transforms.js"></script>

  <script id="vertex-shader" type="x-shader/x-vertex">
  
...

When I open the HTML code in Google Chrome or Microsoft Edge nothing is displayed although I am using the exact same code. It is supposed to show the following.

enter image description here

I have checked that WebGL is enabled in my browsers but I still have the issue. Do I need the libraries and modules listed in the HTML in the same directory or do they all come with the browsers?

How can I debug my issue? Is the problem related to loading the libraries?

javascript

html

webgl2

0 Answers

Your Answer

Accepted video resources