立方体投影,拖动切换视角


        // 构造配置参数,分别设置场景资源,id, 场景类型,场景名称,fov值,fov范围,仰角(pitch)范围
        var configuration = new Hydreigon.PanoConfiguration({
            resource_type: 'pano',     // 场景类型,与materialType保持一致
            render_type: 'cube-list', // 渲染类型
            resource: {               // 资源链接
                source: {
                    image: [
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/f.jpg',
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/b.jpg',
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/l.jpg',
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/r.jpg',
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/u.jpg',
                            'https://hydreigon-dev.cdn.bcebos.com/pano-lite/keting-4000/d.jpg'
                        ],
                    order: 'fblrud'
                }
            }
        }).setId('scene-01').setSceneType('pano').setSceneName('Cool').setFov(70).setFovRange([1, 179]).setPitchRange([-90, 90]);

        var PanoViewer = Hydreigon.PanoViewer;
        var container = document.getElementById("container");
        var options = {debugLayer: false};

        var renderer = Hydreigon.RenderManager.create(container);
        container.appendChild(renderer.canvas);

        var ak = '您的AccessKey';
        var sk = '您的SecretKey';
        
        var panoViewer = new PanoViewer(container, ak, sk, options);
        panoViewer.init(configuration);
        panoViewer.addEventListener('scene-loaded', () => {
            panoViewer.enablePointEvent(true);
        });
        
        renderer.setCurrentViewer(panoViewer);
        Hydreigon.RafManager.add(renderer.render);