title: Three.js twist plane like DNA strand
body: <p>Im trying to twist a plane to make it look like a spiral or DNA shape (ps. its not to actually use as a DNA strand). </p>
  
  <p>Ive got a dotted plane showing at the moment but cannot work out how to twist the plane at all. </p>
  
  <p>JSFiddle: <a href="https://jsfiddle.net/njL9rrne/1/" rel="nofollow">https://jsfiddle.net/njL9rrne/1/</a></p>
  
  <pre><code>var scene = new THREE.Scene();
      var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);
      var renderer = new THREE.WebGLRenderer({ 
        antialias: true,
        alpha: true 
      });
      renderer.setClearColor( 0x000000, 1);
      //var gui = new dat.GUI();
      camera.position.set(0, 0, 500);
      camera.lookAt(scene.position);
  
      var texture = (function() {
        var w = 16, h = 16;
        var canvas = document.createElement('canvas');
        canvas.style.position = 'fixed';
        // document.body.appendChild(canvas);
        canvas.width = w; canvas.height = h;
        var context = canvas.getContext('2d');
        var gradient = context.createRadialGradient(w / 2, h / 2, 0, w / 2, h / 2, w / 2);
        gradient.addColorStop(0, '#ffffff');
        gradient.addColorStop(0.2, '#ffffff');
        gradient.addColorStop(0.4, '#ffffff');
        gradient.addColorStop(1, 'transparent');
        context.fillStyle = gradient;
        context.fillRect(0, 0, w, h);
        var texture = new THREE.Texture(canvas);
        texture.needsUpdate = true;
        return texture;
      }());
  
      var geometry = new THREE.PlaneBufferGeometry(500, 100, 100, 25);
  
      var material = new THREE.PointCloudMaterial({
        color: 0xffffff,
        alphaTest: 0.5,
        size: 5,
        transparent: true,
        map: texture
      });
  
      var pointCloud = new THREE.PointCloud(geometry, material);
      pointCloud.sortParticles = true;
      scene.add(pointCloud);
  
      document.body.appendChild(renderer.domElement);
  
      var step = 0;
      var render = function() {
        window.requestAnimationFrame(render);
  
        step += 0.004;
        pointCloud.rotation.x = step;
        // pointCloud.rotation.z = step;
  
        renderer.render(scene, camera);
  
      };
  
      var resize = function() {
        camera.aspect = window.innerWidth / window.innerHeight;
        camera.updateProjectionMatrix();
        renderer.setSize(window.innerWidth, window.innerHeight);
      };
      window.addEventListener('resize', resize);
  
      resize();
      render();
  </code></pre>