渐变清晰三个js的颜色

Question

我可以在threejs中获得一个可靠的clearColor，但有没有办法实现渐变clearColor。或者用一些类似的方法在我的天空中实现更深的深度，也许还有灯光？

这是我的相关代码：

renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setClearColor( 0x3dc800 );

var light = new THREE.HemisphereLight( 0xffffff, 0xeeeeee, 0.75 );
  light.position.set( 0.5, 1, 0.75 );
  scene.add( light );

scene.fog = new THREE.Fog( 0x4ff904, 0, 750 );

Answer 1

我遇到了这个代码：

http://codepen.io/billimarie/pen/mJLeBY

我没有信任，但它完美地回答了这个问题。

相关的块是：

renderer = new THREE.CanvasRenderer( { alpha: true }); // gradient

与css：

body {
            background-color: #1A8FCF;
            margin: 0px;
            overflow: hidden;
            background-image: -webkit-gradient(#1A8FCF,#D1236A,#1A8FCF);
            /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
            background-image: -webkit-linear-gradient(#1A8FCF,#D1236A,#1A8FCF);
            /* Firefox 3.6 - 15 */
            background-image: -moz-linear-gradient(#1A8FCF,#D1236A,#1A8FCF);
            /* Opera 11.1 - 12 */
            background-image: -o-linear-gradient(#1A8FCF,#D1236A,#1A8FCF);
            /* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */
            background-image: linear-gradient(#1A8FCF,#D1236A,#1A8FCF);
        }

**注意，我自己的颜色......

Answer 2

有关透明背景渲染的信息，请参阅Transparent background with three.js，然后您可以应用CSS渐变http://www.w3schools.com/Css/css3_gradients.asp，但除非您感到非常棘手，否则它不会随着您的场景移动。