Three.js Sky Sphere рендерится вбок

Question

У меня работает моя небесная сфера... кроме... она рендерится вбок... "нижняя" и "верхняя" области расположены вдоль базовой плоскости. Я подумал, что это может быть как-то связано с тем, что у меня есть ось "у" в качестве направления "вверх" для моей камеры (и я не хочу это менять). Тем не менее, я расстроен после двух часов попыток выяснить это. Я взял вершинные и фрагментные шейдеры из этого урока, где, как мне кажется, skydome рендерится как надо. Я все еще довольно озадачен тем, что происходит внутри этих шейдеров, и не хочу, чтобы у меня оставалось много волшебных мыслей о том, что здесь происходит. Помощь оценена!

Вот код:

function skyGeo( topColor, bottomColor, radius ){

this.topColor = topColor || 0x0077ff;
this.bottomColor = bottomColor || 0xffffff;

this.vertexShader = [
    "varying vec3 vWorldPosition;", "void main() {", "  vec4 worldPosition = modelMatrix * vec4( position, 1.0 );" , "  vWorldPosition = worldPosition.xyz ;",
    "  gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );", "}",
    ].join("\n");
this.fragmentShader = [
    "uniform vec3 topColor;", "uniform vec3 bottomColor;", "uniform float offset;", "uniform float exponent;", "varying vec3 vWorldPosition;", "void main() {",
    "  float h = normalize( vWorldPosition + offset ).y;", "  gl_FragColor = vec4( mix( bottomColor, topColor, max( pow( h, exponent ), 0.0 ) ), 1.0 );", "}",
    ].join("\n");   

this.radius = radius || 1000;

this.geo = new THREE.SphereGeometry( this.radius, 32, 32 );
this.uniforms = {
  topColor: {type: "c", value: new THREE.Color( this.topColor )}, 
  bottomColor: {type: "c", value: new THREE.Color( this.bottomColor )},
  offset: {type: "f", value: this.radius }, 
  exponent: { type: "f", value: 1.5 },
};
this.material = new THREE.ShaderMaterial({ vertexShader: this.vertexShader, fragmentShader: this.fragmentShader, uniforms: this.uniforms, side: THREE.DoubleSide, fog: false });
this.mesh = new THREE.Mesh( this.geo, this.material );
this.mesh.rotation.order = 'XZY';
this.mesh.renderDepth = 3000;
this.mesh.scale.set( -1, 1, 1 );

entities.skyGeo = this.mesh;

this.scene.add( this.mesh );    

}

Спасибо!