Flat donut :)

by thierrymichel

HTML

<script src="https://cdn.rawgit.com/mrdoob/three.js/dev/build/three.min.js"></script>

JavaScript

var camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 1, 100);
camera.position.z = 35;

var scene = new THREE.Scene();

var light = new THREE.PointLight();
light.position.set(0, 20, 50);
scene.add(light);

var renderer = renderer = new THREE.WebGLRenderer({
  antialias: true,
  alpha: true
});
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

var outerRadius = 10;
var innerRadius = 5;

var arcShape = new THREE.Shape();
arcShape.moveTo(outerRadius, 0);
arcShape.absarc(0, 0, outerRadius, 0, Math.PI * 2, false);

var holePath = new THREE.Path();
holePath.moveTo(innerRadius, 0);
holePath.absarc(0, 0, innerRadius, 0, Math.PI * 2, true);
arcShape.holes.push(holePath);

var extrudeSettings = {
  amount: 2,
  bevelEnabled: false,
  curveSegments: 40,
  material: 0,
  extrudeMaterial: 1
};

var geometry = new THREE.ExtrudeGeometry(arcShape, extrudeSettings);

geometry.computeBoundingBox();
geometry.computeVertexNormals();

for (var i = 0; i < geometry.faces.length; i++) {
  var face = geometry.faces[i];
  if (face.materialIndex == 1) {
    for (var j = 0; j < face.vertexNormals.length; j++) {
      face.vertexNormals[j].z = 0;
      face.vertexNormals[j].normalize();
    }
  }
}

var material = new THREE.MultiMaterial([
  new THREE.MeshPhongMaterial({
    color: 0xf00fff,
    shading: THREE.FlatShading
  }), // front
  new THREE.MeshPhongMaterial({
    color: 0xf00fff,
    shading: THREE.SmoothShading
  }) // side
]);

var mesh = new THREE.Mesh(geometry, material);

mesh.position.set(0, 0, 0);

scene.add(mesh);

animate();

function animate() {
  requestAnimationFrame(animate);
  mesh.rotation.y -= 0.01;
  renderer.render(scene, camera);
}