Multi-platform (Chrome, IE, Firefox)

Multi-platform (Chrome, IE, Firefox)

本文关键字:Firefox IE Multi-platform Chrome      更新时间:2023-09-26

我不知道为什么这个脚本在IE中不起作用,而它在Firefox和Chrome中工作。当我尝试在IE中使用此脚本时,我收到此消息" ACTIVEX停止脚本"。

请帮助我。

<!DOCTYPE html>
<html>
<head>
  <title>Getting Started with Three.js</title>
  <script type="text/javascript" src="http://www.html5canvastutorials.com/libraries/Three.js"></script>
  <script type="text/javascript">
  window.onload = function() {
    var renderer = new THREE.WebGLRenderer();
    renderer.setSize( 800, 600 );
    document.body.appendChild( renderer.domElement );
    var scene = new THREE.Scene();
    var camera = new THREE.PerspectiveCamera(
      35,       // Field of view
      800 / 600,    // Aspect ratio
      0.1,      // Near plane
      10000       // Far plane
    );
    camera.position.set( 15, 10, 10 );
    camera.lookAt( scene.position );
    scene.add( camera );
    var cube = new THREE.Mesh(
      new THREE.CubeGeometry( 5, 5, 5 ),
      new THREE.MeshLambertMaterial( { color: 0xFF0000 } )
    );
    scene.add( cube );
    var light = new THREE.PointLight( 0xFFFF00 );
    light.position.set( 10, 0, 10 );
    scene.add( light );
    renderer.render( scene, camera );
  };
  </script>
</head>
<body></body>

The Three.js WebGLRenderer 在 IE 中不起作用(不支持 WebGL)

尝试

var 渲染器 = 新的 THREE。CanvasRenderer()

相反

作为上面非常简单的解决方案的替代方案,您可以使用alteredq和mrdoob出色的Detector.js脚本包含在三个.js的示例中。如果您使用如下所示的代码,则可以默认使用 WebGLRenderer,并且仅在 WebGL 不可用时才使用 canvas。您还可以使用像 webglEnabled 这样的标志,以便稍后在代码中根据渲染器设置其他选项。

var webglEnabled = false;
var webglReq = false;
if (Detector.webgl) {
    renderer = new THREE.WebGLRenderer(
            {
                antialias: true,
                preserveDrawingBuffer: true
            });  // allow screenshot 
    webglEnabled = true; // set flag 
}
else if (webglReq) { Detector.addGetWebGLMessage(); return false; } 
else {
    renderer = new THREE.CanvasRenderer();
}
renderer.setClearColorHex(0x000000, 1);
renderer.setSize(window.innerWidth, window.innerHeight);