three.js - multiple renders pass not showing all geomtries

I am trying to create a globe using three.js sphere geometry and i want to put a background image of starry background for which i am using plane geometry.I am creating two scenes and two cameras (perspective and orthographic for plane geometry ),one for earth and other for starry background. To show both scenes together on the screen,i am creating two renderpasses and using EffectComposer to implement the task. But i am unable to get the globe and background image together.It outputs only background image,but no sphere?

what am i doing wrong? Here is my code for renderpassing:

        var camerabg = CameraBG(); // create a orthographic camera
        var sceneBG  = BgScene();  // create a background plane mesh and add it to scene


        var bgPass     = new THREE.RenderPass(sceneBG, camerabg);
        var renderPass = new THREE.RenderPass(scene, camera);
        renderPass.clear = false;
        var effectCopy = new THREE.ShaderPass(THREE.CopyShader);
        effectCopy.renderToScreen = true;

        // add these passes to the composer
        var composerScene = new THREE.EffectComposer(renderer);

        composerScene.addPass(bgPass);
        composerScene.addPass(renderPass);
        composerScene.addPass(effectCopy);

        var render = function(){
                        requestAnimationFrame(render);
                        cameraControl.update();
                        renderer.autoClear = false;
                        renderer.clear();
                        composerScene.render();     
                };