Три JS, как отобразить ось xyz по всем моделям внутри сцены?

В настоящее время я хочу отображать ось над кубом (а не через него). Но я не могу найти способ сделать это. Кто-нибудь знает, как отображать линии оси над модулем куба? Спасибо.

Предоставили код JS ниже. Куб будет отображаться в scene, а линии осей будут отображаться в fscene. (Предполагается, что осевые линии, визуализируемые в fscene, покрывают куб, который визуализируется в scene)

    var container, stats;

    var camera, scene, fscene, renderer;

    var cube, plane;

    function init() {

        container = document.createElement( 'div' );
        document.body.appendChild( container );

        camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.01, 999999 );
        camera.position.y = 5;
        camera.position.z = 5;
        camera.position.x = 4;
        camera.lookAt(new THREE.Vector3());

        scene = new THREE.Scene();
        fscene = new THREE.Scene();

        // Cube

        var geometry = new THREE.CubeGeometry( 1, 1, 1 );

        for ( var i = 0; i < geometry.faces.length; i ++ ) {

            geometry.faces[ i ].color.setHex( 0xcccccc * i );

        }

        var material = new THREE.MeshBasicMaterial( { vertexColors: THREE.FaceColors } );
        cube = new THREE.Mesh( geometry, material );
        scene.add(cube);

        addAxis();

        renderer = new THREE.WebGLRenderer({ antialias: true });
        renderer.autoClear = false;
        renderer.setSize( window.innerWidth, window.innerHeight );

        container.appendChild( renderer.domElement );
        animate();
    }


    function animate() {

        requestAnimationFrame(animate);
        renderer.clear();
        renderer.render(scene, camera);

        renderer.render(fscene, camera);
    }

    function addAxis() {
        var sceneSize = 9000;
        line({ begin: [0, 0, 0], end: [sceneSize, 0, 0], color: 0xff0000, scene: scene });
        line({ begin: [0, 0, 0], end: [-sceneSize, 0, 0], color: 0xff0000, dashed: true, scene: scene });
        line({ begin: [0, 0, 0], end: [0, sceneSize, 0], color: 0x00ff00, scene: scene });
        line({ begin: [0, 0, 0], end: [0, -sceneSize, 0], color: 0x00ff00, dashed: true, scene: scene });
        line({ begin: [0, 0, 0], end: [0, 0, sceneSize], color: 0x0000ff, scene: scene });
        line({ begin: [0, 0, 0], end: [0, 0, -sceneSize], color: 0x0000ff, dashed: true, scene: scene });
    }

    function line(cfg){
        var p = cfg.begin;
        var q = cfg.end;
        if (cfg.color) {
            cfg.colorb = cfg.colorb || cfg.color;
            cfg.colore = cfg.colore || cfg.color;
        }
        var geometry = new THREE.Geometry();
        var material = cfg.dashed ? new THREE.LineDashedMaterial({ linewidth: 1, color: cfg.color, dashSize: 1, gapSize: 1, depthWrite:false }) : new THREE.LineBasicMaterial({ vertexColors: THREE.VertexColors, depthWrite:false });
        var cp = new THREE.Color(cfg.colorb);
        var cq = new THREE.Color(cfg.colore);

        geometry.vertices.push(new THREE.Vector3(p[0], p[1], p[2]));
        geometry.vertices.push(new THREE.Vector3(q[0], q[1], q[2]));
        geometry.colors.push(cp,cq);
        geometry.computeLineDistances();

        var line = new THREE.Line(geometry, material, THREE.LinePieces);
        fscene.add(line);
    }