Exported GLTF scene appearing correctly in Blender, but as a white sphere anywhere else

Questions
1

As the title says, the scene is supposed to look like this(Blender):

image
image1088×615 53.3 KB

but in any other editor it shows up a white sphere:

image
image1452×868 80.9 KB

I am fairly new to generating GLTFs and overall graphics rendering pipelines, could you please help me identify the issue? I could not find anything like this on the web.

Here is the gltf in question:
pie_1659516087825.gltf (380.9 KB)

Im using this script to generate the scene:

const createScene = () => {
    const SCREEN_WIDTH = 1920;
    const SCREEN_HEIGHT = 1080;

    const scene = new THREE.Scene()
    let camera = new THREE.PerspectiveCamera(40, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000);
    camera.position.set(700, 200, - 500);


    const light = new THREE.DirectionalLight(0xaabbff, 1);
    light.position.x = 300;
    light.position.y = 250;
    light.position.z = - 500;
    scene.add(light);


    const uniforms = {
        topColor: { value: new THREE.Color(0x0077ff) },
        bottomColor: { value: new THREE.Color(0xffffff) },
        offset: { value: 400 },
        exponent: { value: 0.6 }
    };
    uniforms.topColor.value.copy(light.color);

    const skyGeo = new THREE.SphereGeometry(4000, 32, 15);
    const skyMat = new THREE.ShaderMaterial({
        uniforms: uniforms,
        vertexShader: document.getElementById('vertexShader').textContent,
        fragmentShader: document.getElementById('fragmentShader').textContent,
        side: THREE.BackSide
    });

    const sky = new THREE.Mesh(skyGeo, skyMat);
    scene.add(sky);

    const geometry = new THREE.CylinderGeometry(1.4, 1.4, 0.3, 32);
    const material = new THREE.MeshLambertMaterial({ color: 0xdddddd })
    const cylinder = new THREE.Mesh(geometry, material);
    scene.add(cylinder);
    cylinder.position.y = 0.15

    const light1 = new THREE.PointLight(0xffffff, 1, 100);
    light1.position.set(50, 50, 50);
    scene.add(light1);

    function createSegment(radius, angleStart, angleEnd, height, color) {
        var options = {
            curveSegments: 32,
            steps: 1,
            depth: height,
            bevelEnabled: true,
            bevelSize: 0.01,
            bevelOffset: 0,
            bevelSegments: 1,
            bevelThickness: 0.01
        };

        var Shape = new THREE.Shape();
        Shape.moveTo(0, 0);
        Shape.absarc(0, 0, radius, angleStart, angleEnd, false);
        Shape.lineTo(0, 0);

        var SegmentGeom = new THREE.ExtrudeGeometry(Shape, options);
        SegmentGeom.rotateX(-Math.PI / 2);
        var SegmentMat = new THREE.MeshLambertMaterial({
            color: color,
            opacity: 0.95,
            transparent: true
        });
        var Segment = new THREE.Mesh(SegmentGeom, SegmentMat);
        Segment.position.y = 0.3
        return Segment;
    }


    let clrs = ['#9de19a', '#a4c5ea', '#bca9e1', '#e7eca3', '#98a7f2',]
    let arr = [10, 20, 14, 33, 44]
    arr.sort((a, b) => a - b)
    const sum = arr.reduce((p, a) => p + a, 0);
    let ratios = []
    for (let el of arr) {
        ratios.push((el * 2 / sum))
    }

    for (let i = 0; i < ratios.length; i++) {

        let endingAngle = null
        let startingAngle = null

        if (i == 0) {
            startingAngle = 0
        }
        else {
            startingAngle = ratios[i]
        }

        if (i == ratios.length - 1) {
            endingAngle = 0
        }
        else {
            endingAngle = ratios[i + 1]
        }

        var smallSegment = createSegment(1, THREE.MathUtils.degToRad(startingAngle * 360),
            THREE.MathUtils.degToRad(endingAngle * 360), ratios[i], clrs[i]);

        scene.add(smallSegment);
    }

    return scene
}

there is also the vertex shader

varying vec3 vWorldPosition;

void main() {

	vec4 worldPosition = modelMatrix * vec4( position, 1.0 );
	vWorldPosition = worldPosition.xyz;

	gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );

}

and the fragment shader:

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( max( h, 0.0 ), exponent ), 0.0 ) ), 1.0 );

}