chrome.js雾上铬手机无法正常工作

时间:2014-12-08 23:17:34

标签: google-chrome three.js

我有一个场景,我为它添加了一些雾,结果是雾充满了我的整个屏幕,就像有一个纯黑色的背景。

Chrome版本:39.0.2171.93 移动设备:nexus 5 Android:lolipop

这是我的代码:

 Demo.prototype.initializeScene = function( settings ) {

    var defaults = {

        fogColor: 0x000000,
        fogIntensity: 0.0005,
        near:50000,
        far:120000

    };

    this.options.scene = $.extend(true, defaults, settings);

    this.scene = new THREE.Scene();
    this.scene.fog = new THREE.FogExp2( this.options.scene.fogColor, this.options.scene.fogIntensity );


}

该代码在桌面和其他移动设备上运行良好。 如果我除去雾,一切似乎都很好。

此外,一切都发生在用搅拌机创建的圆顶(json)网格内,然后加载,这是代码,以防它成为一个重大问题。

Demo.prototype.initializeEnvironment = function() {

    var that = this;

    loadMesh("geometry/dome.json", function(geometry, materials) {

        var materials = [
            new THREE.MeshLambertMaterial({ color: 0x3333ff, shading: THREE.FlatShading, overdraw: false}),
            new THREE.MeshLambertMaterial({ color: 0x2e2eff, wireframe: true})
        ];

        that.dome = new THREE.SceneUtils.createMultiMaterialObject(geometry, materials);
        that.dome.position.set(0,0,0);
        that.dome.scale.set(500,500,500);
        that.scene.add(that.dome);

    });

}

最后是渲染器代码:

Demo.prototype.initializeRenderer = function( settings ) {

    var defaults = {

        init :{
            antialias: true, 
            alpha: true,
            autoClear: false
        },

        clearColor: 0x000000,
        clearColorIntensity: 1

    };

    this.options.renderer = $.extend(true, defaults, settings);

    this.renderer = new THREE.WebGLRenderer( this.options.renderer.init );
    this.renderer.setClearColor( this.options.renderer.clearColor, this.options.renderer.clearColorIntensity );
    this.renderer.setSize( this.options.generic.container.clientWidth, this.options.generic.container.clientHeight );

    this.options.generic.container.appendChild( this.renderer.domElement );

}

1 个答案:

答案 0 :(得分:2)

我正在使用Three.js r73并在Android 5的Nexus 4上遇到同样的问题.Fog似乎在禁用抗锯齿后再次运行。

您可以通过设置渲染器的pixelRatio来实现相同的抗锯齿效果。这是我的所作所为:

renderer.setPixelRatio((window.devicePixelRatio || 1) * 2);