Start a New Example

Let's fork the project and create a new example. We can copy everything from examples/00.

Please note that we are not going to bundle the JS for our example. Therefore, I will add some nice folder strucutre. The main JS file will be called main.js and the rest of the files will be put in assets/js/. Make sure to update the HTML. We should have something like this:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="icon" href="../resources/favicon.ico" />
    <link rel="stylesheet" type="text/css" href="./assets/css/styles.css" />
    <script src="../libs/three.js"></script>
    <script src="../libs/smooth-zoom.js"></script>
    <title>IFC.js</title>
  </head>
  <body>
    <div id="loading" class="loaderBackground">
      <div class="loader"></div>
    </div>
    <div id="generalContainer">
      <div id="GUI">
        <input readonly type="file" id="openFileDialog" />
        <button
          class="normalButton"
          onclick="document.getElementById('openFileDialog').click();"
        >
          Open
        </button>
      </div>
      <canvas id="c"></canvas>
    </div>
    <script src="../libs/chevrotain.min.js"></script>
    <script src="../libs/OrbitControls.js"></script>
    <script type="module" src="main.js"></script>
  </body>
</html>

Please note that I have moved the CSS into the assets folder.

PreviousStep by StepNextMain JS file

Last updated