三个js中的场景旋转问题

var container = document.getElementById('three');
var width = container.offsetWidth;
var height = container.offsetHeight;
var range = document.getElementById('r');
var sceneChildren = new THREE.Group();
var rotationY = 0;
var renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true});
renderer.setSize(width, height);
container.appendChild(renderer.domElement);

var scene = new THREE.Scene();

var cubeGeometry = new THREE.CubeGeometry(100, 100, 100);
var cubeMaterial = new THREE.MeshLambertMaterial({ color: 0xffffff });
var cube = new THREE.Mesh(cubeGeometry, cubeMaterial);
cube.rotation.y = Math.PI * 45 / 180;


var camera = new THREE.PerspectiveCamera(45, width / height, 0.1, 10000);
camera.position.y = 160;
camera.position.z = 400;
camera.lookAt(cube.position);

sceneChildren.add(cube, camera);
scene.add(sceneChildren)

var skyboxGeometry = new THREE.CubeGeometry(10000, 10000, 10000);
var skyboxMaterial = new THREE.MeshBasicMaterial({ color: 0xf3f3f3f3, side: THREE.BackSide });
var skybox = new THREE.Mesh(skyboxGeometry, skyboxMaterial);

scene.add(skybox);

var pointLight = new THREE.PointLight(0xff33fff);
pointLight.position.set(0, 300, 200);


var pointLight2 = new THREE.PointLight(0xffffff);
pointLight2.position.set(0, -300, 200);

scene.add(pointLight, pointLight2);

var clock = new THREE.Clock;

let controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.screenSpacePanning = true;

range.addEventListener('input', (e) => {
  rotationY = e.target.value
})

function render() {
        requestAnimationFrame(render);
        sceneChildren.rotation.y = rotationY;
        controls.update();
        renderer.render(scene, camera);
}

render();

#three {
        height: 500px;
        width: 500px;
}
#r {
  z-index: 99999;
  float: left;
  background: red;
}

<script src="https://cdn.jsdelivr.net/npm/[email protected] /cdn-cgi/l/email-protection/build/three.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected] /cdn-cgi/l/email-protection/examples/js/controls/OrbitControls.js"></script>
Rotate scene children <input type="range" min="0" max="60" step="0.01" id="r">
<div id="three"></div>