在iOS的three.js场景中可以包含多少个灯光是否有限制?以下代码可在Linux,Mac和Windows上运行...但是在iOS上则无法运行(已在Firefox焦点和野生动物园上测试)。如果我将光量从15降低到14可以正常工作,但是当我通过15时就无法在iOS上正常工作
let AMOUNT = 15
let scene = new THREE.Scene()
let camera = new THREE.PerspectiveCamera(40, innerWidth/innerHeight, 0.1, 1000)
camera.position.z = 4
let renderer = new THREE.WebGLRenderer()
renderer.setSize(innerWidth, innerHeight)
document.body.appendChild(renderer.domElement)
let tx = new THREE.TextureLoader()
.load('https://s4.mzstatic.com/us/r1000/046/Purple/bd/8f/fd/mzl.emkswtfe.jpg')
let geometry = new THREE.BoxGeometry( 1, 1, 1 )
let material = new THREE.MeshPhongMaterial({map:tx})
let cat = new THREE.Mesh( geometry, material )
cat.position.z = -2
scene.add( cat )
// point lights
class Point {
constructor(i){
let g = new THREE.SphereBufferGeometry( 0.1, 4, 4 )
let m = new THREE.MeshBasicMaterial({color:'#ff0'})
this.mesh = new THREE.Mesh( g, m )
this.light = new THREE.PointLight('#fff', 0.1, 100 )
this.mesh.add(this.light)
this.mesh.name = 'point'
let y = 1 - i/8
this.mesh.position.set(0,y,0)
}
update(tick){
let x = Math.sin(tick) * 1
this.mesh.position.x = x
}
}
let points = []
for (let i = 0; i < AMOUNT; i++) {
let s = new Point(i)
points.push(s)
scene.add(s.mesh)
}
let clock = new THREE.Clock()
function animate() {
let tick = clock.getElapsedTime()
requestAnimationFrame( animate )
points.forEach(spark=>spark.update(tick))
renderer.render( scene, camera )
}
animate()
border { margin: 0; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/95/three.min.js"></script>