Pannellum 360全景图片展示

最新推荐文章于 2024-08-08 08:08:20 发布

苹果园dog

最新推荐文章于 2024-08-08 08:08:20 发布

阅读量1k

点赞数

分类专栏： WebGL 文章标签： docker javascript

本文链接：https://blog.csdn.net/u014556081/article/details/113185762

版权

WebGL 专栏收录该内容

24 篇文章

订阅专栏

1、介绍

Pannellum是用于Web的轻量级，免费和开放源代码的360全景图片查看器。它是使用HTML5，CSS3，JavaScript和WebGL构建的，没有插件。

提供了大图片切片工具generate.py Python脚本，可展示多分辨率图片。

2、影像切片

也可以不切片，但是图片太大就要切片，可提高加载效率。

提供了docker镜像，可免于安装依赖，切片过程如下（win10系统）：

3、使用方法

复制代码

var viewer = pannellum.viewer('panorama', {
            "autoRotate": -2,
            "default": {
                "firstScene": "DJI_0157",
                "sceneFadeDuration": 1000,
                "autoLoad": true
            },
            "scenes": {
                "DJI_0157": {
                    "title": "1/阳朔市DJI_0157",
                    "hfov": 100,
                    "pitch": 10,
                    "yaw": 50,
                    "compass": false,
                    "northOffset": 289,
                    "type": "multires",
                    "multiRes": {
                        "basePath": "http://ip:9008/file/360pic/output/DJI_0157",
                        "path": "/%l/%s%y_%x",
                        "fallbackPath": "/fallback/%s",
                        "extension": "jpg",
                        "tileResolution": 512,
                        "maxLevel": 4,
                        "cubeResolution": 2600
                    },
                    "hotSpots": [
                        {
                            "pitch": -2.1,
                            "yaw": 132.9,
                            "type": "scene",
                            "text": "阳朔市DJI_0158",
                            "sceneId": "DJI_0158"
                        }
                    ]
                },
                "DJI_0158": {
                    "title": "2/阳朔市DJI_0158",
                    "hfov": 100,
                    "pitch": 10,
                    "yaw": 50,
                    "compass": false,
                    "northOffset": 289,
                    "type": "multires",
                    "multiRes": {
                        "basePath": "http://ip:9008/file/360pic/output/DJI_0158",
                        "path": "/%l/%s%y_%x",
                        "fallbackPath": "/fallback/%s",
                        "extension": "jpg",
                        "tileResolution": 512,
                        "maxLevel": 4,
                        "cubeResolution": 2600
                    },
                    "hotSpots": [
                        {
                            "pitch": -2.1,
                            "yaw": 132.9,
                            "type": "scene",
                            "text": "阳朔市DJI_0159",
                            "sceneId": "DJI_0159"
                        }
                    ]
                },

复制代码