index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Lichtbundel</title>
</head>
<body>

<canvas id="drawcanvas" width="800" height="800" style="border:1px solid #000000;">
</canvas><script type="module" src="lightapp.js"> </script>
<div style="display: inline-block; vertical-align: top;">

    <div id="linetype">
    <input type="radio" id="lineChoice1"
           name="linetype" value="figure" checked="true">
    <label for="lineChoice1">Figuur</label>
    <input type="radio" id="lineChoice2"
           name="linetype" value="light">
    <label for="lineChoice2">Lichtstraal</label>

</div>
    <div id="collisontext">Collisions:</div><div  style="display: inline-block;" id="collisionnumber"></div>
    <div>

        <button type="button" id="clear">Maak leeg</button>

    </div>


<ul id="lineslist"> Lines:
</ul>
    <ul id="lightlist"> Light:
    </ul>

</div>
</body>
</html>