Creating A 3D Interactive Lines Animation with Three.js and Canvas

Category: Animation , Javascript , Recommended | July 10, 2015
AuthorJoanClaret
Last UpdateJuly 10, 2015
LicenseMIT
Tags
Views5,526 views
Creating A 3D Interactive Lines Animation with Three.js and Canvas

A lightweight JavaScript library which utilizes three.js and canvas element to create a 3D lines animation with mouse interaction.

How to use it:

Load the necessary three.js JavaScript library in the web page.

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r71/three.min.js"></script>

Load the helpers in the web page.

<script src="js/projector.js"></script>
<script src="js/canvas-renderer.js"></script>

Load the core JavaScript.

<script src="js/3d-lines-animation.js"></script>

Create the layout.

<section class="canvas-wrap">
  <div class="canvas-content">
    Content goes here
  </div>
</section>

You Might Be Interested In:


Leave a Reply