Tregon THREE.js

by Konstantin Cryman

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script> 
<script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/controls/OrbitControls.js"></script> 

<div id="container"></div>

CSS

html, body {
  margin: 0;
  padding: 0;
  overflow: hidden;
}

JavaScript

var camera, controls, scene, renderer, gOut, gInn

  init()
  render()

  function init() {
  
    // renderer
    renderer = new THREE.WebGLRenderer({ antialias: false })
    renderer.setSize(window.innerWidth, window.innerHeight)
    
    scene = new THREE.Scene()

    camera = new THREE.PerspectiveCamera(
      60,
      window.innerWidth / window.innerHeight,
      1,
      16000,
    )
    camera.position.z = 700
    camera.position.y = 0
    scene.add(camera)
    

    container = document.getElementById("container")
    container.appendChild(renderer.domElement)

    controls = new THREE.OrbitControls( camera, renderer.domElement,  )
    controls.addEventListener("change", render)

    // lights
    light = new THREE.PointLight(0xffffff)
    camera.add(light)

    light = new THREE.AmbientLight(0x222222)
    scene.add(light)
    
  }

  function render() {
    gInn.rotation.z += 0.1

    renderer.render(scene, camera)
  }

  console.log(THREE)