展示全景图

[!TIP|labelVisibility:hidden|iconVisibility:hidden] navigator.panorama.showByConfig(panoramaArray, panoramaIndex, resultCallback)

支持平台：

• Android
• iOS

参数说明

panoramaArray 是一个全景图数据对象数组，数组里对象包含以下属性：

• url（String/必选） --全景图图片URL
• thumbnail（String/必选） --全景图缩略图图片URL
• title（String/必选） --导航栏标题
• des（String/必选） --简介
• lookAt（Number/必选） --初始镜头对准的水平位置[0,1]，(xPos/width)
• bgm（String/必选） --背景音乐的URL
• tel（String/必选） --电话
• hot（Array/必选）--数组里面是每一个热点对象，该对象其属性包含以下一项或多项：
  • x（Number/必选） --热点水平方向位置，范围(0,1)
  • y（Number/必选） --热点垂直方向位置，范围(0,1)
  • width（String/必选） --宽，范围(0,1)，相对于当前设备屏幕宽度
  • height（String/必选） --高，范围(0,1)，相对于当前设备屏幕宽度
  • title（String/可选） --标题
  • icon（String/可选） --图标
  • clickJump（Int/必选） --点击后跳转到panoramaArray的index,从0开始
  • video（String/可选） --视频URL
  • url（String/可选） --内容URL
  • align（String/必选） --对齐方式，默认热点的正中心和指定的坐标点重合，可取值leftTop(左上)，leftBottom(左下)，rightTop(右上)，rightBottom(右下)

panoramaIndex（Int/必选） --要展示的全景图在数组中的索引，从0开始

resultCallback 函数会返回一个对象，其属性包含以下一项或多项：

• type（Int） --返回（0：全景图显示成功，1:热点点击（未配置clickJump时触发）,-1:失败）
• panoramaIndex（Int) --点击的热点在panoramaArray中的位置
• hotIndex（Int) --点击的热点在hot中的位置
• message（String） --相关信息

[!WARNING]

• 关于icon、title、video、url组合方式五种,(优先级url>video>icon、title),选择其中一种传参：
  • 1.icon;
  • 2.title;
  • 3.icon和title;
  • 4.video;
  • 5.url;
• 关于width和height在Android设备下必须指定，在iOS设备下没有指定的情况下，会自动获取icon的宽高，但是当没有指定icon的情况下，必须指定该参数;

示例代码

// 引用js
<script src='supconit://hcmobile.js'></script>
<script>
    // 监听’deviceready‘事件
    document.addEventListener('deviceready', onDeviceReady, false)
    function onDeviceReady() {
    var music = "https://www.yd-mobile.cn/cc/mp3.mp3";
    var succ0 = {
        "url": "https://www.yd-mobile.cn/cc/欢迎区.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/1-欢迎区.jpg",
        "title": "欢迎区",
        "des": "1.欢迎区\n欢迎各位领导、嘉宾莅临参观中控信息展厅！\n中控信息公司展厅参观路线：\n1欢迎区→2公司介绍→3领导关怀→4荣誉墙+宣传片→5智慧架构（全面感知、综合监控、智能管理、智慧运营）→6智慧大交通（公路、城市、轨道交通）→7智慧大环境（水务、建筑、旅游、管廊）→8业务总览→9大数据展示平台→10照片墙\n" ,
        "lookAt": 0.69,
        "tel": "about.html",
        "bgm": music,
        hot: [
            {
                "x": 0.8,
                "y": 0.7,
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "align":"leftBottom",
                "clickJump": 9,
            },
            {
                "x": 0.8,
                "y": 0.7,
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif"
            }
        ]
    };
    var succ1 = {
        "url": "https://www.yd-mobile.cn/cc/公司介绍.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/2-公司介绍.jpg",
        "title": "公司介绍",
        "des": "2.公司介绍\n中控集团\n中控集团，始创于1993年，总部位于杭州滨江。作为中国领先的自动化、信息化与智能化技术、产品与解决方案供应商，业务涉及流程工业自动化及智能制造、智慧城市、工业操作系统、工控安全、智能芯片、高端仪器、运维服务等众多领域。“中控”与“SUPCON”已成为业内国际知名品牌。\n中控信息\n浙江浙大中控信息技术有限公司（简称：中控信息）是中控集团重要的组成部分，核心业务是“智慧城市”解决方案及相关信息系统集成服务。\n中控信息以城市综合管理系统建设为核心，集成多种信息系统、控制系统及海量数据，通过一个完整架构、一套公共基础设施（网络基础设施、海量数据中心、城市公共服务云、安全运维平台）和两大业务应用板块（大交通、大环境）的“1+1+2”系统建设，完成众多成功案例，为城市建设打造涵盖大交通、大环境领域众多智能基础设施，使“智慧城市”成功地从概念走向现实。\n以“ｅ城市·易生活”为理念，“智慧大交通”、“智慧大环境”、新型智慧城市为主要内容的智慧城市建设者。业务领域覆盖智慧城市全产业链，建设项目遍及中国32个省份区域及东南亚、非洲等地，为城市打造了涵盖大交通、大环境领域众多智能基础设施，助力智慧城市从概念走向现实。\n",
        "lookAt": 0.31,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.64537,
                "y": 0.63462,
                "title": "欢迎区",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 0,
            },
            {
                "x": 0.12794,
                "y": 0.63462,
                "title": "领导关怀",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 2
            },
        ]
    };
    var succ2 = {
        "url": "https://www.yd-mobile.cn/cc/领导关怀.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/3-领导关怀.jpg",
        "title": "领导关怀",
        "des": "3.领导关怀\n中控的成长和发展得到各级领导、社会各界人士的关心与支持，习近平、胡锦涛、李克强、温家宝等党和国家领导人都曾亲临中控视察指导。",
        "lookAt": 0.042,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.29,
                "y": 0.6,
                "title": "公司介绍",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 1,
            },
            {
                "x": 0.77,
                "y": 0.6,
                "title": "荣誉墙+宣传片",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 3
            }
        ]
    };
    var succ3 = {
        "url": "https://www.yd-mobile.cn/cc/荣誉墙+宣传片.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/4-荣誉墙+宣传片.jpg",
        "title": "荣誉墙+宣传片",
        "des": "4.荣誉墙+宣传片\n成立以来，中控信息始终专注于智慧城市各领域的开拓和建设，在各个行业都得到了用户、政府、行业协会、媒体等社会各界的肯定",
        "lookAt": 0.5,
        "tel": 1893333,
        "bgm": music,
        "hot": [
            {
                "x": 0.93573,
                "y": 0.59797,
                "title": "领导关怀",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 2,
            },
            {
                "x": 0.07522,
                "y": 0.59697,
                "title": "智慧架构",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "video": "",
                "clickJump": 4
            },
            {
                "x": 0.5,
                "y": 0.5,
                "icon": "https://www.yd-mobile.cn/cc/点我查看.gif",
                "video": "https://www.yd-mobile.cn/cc/mp4.mp4",
            },
            {
                "x": 0.74908614,
                "y": 0.5034073,
                "width": "0.25",
                "height": "0.33",
                "icon": "https://www.yd-mobile.cn/cc/jbtm.png",
                "video": "",
                direct() {
                    navigator.glPreviewer.preview('https://www.yd-mobile.cn/cc/ok.zip','jiangbei.obj');
                }
            },
            {
                "x": 0.5,
                "y": 0.5,
                "title": "智慧架构leftTop",
                "align": "leftTop"
            },
            {
                "x": 0.5,
                "y": 0.5,
                "title": "智慧架构leftBottom",
                "align": "leftBottom"
            },
            {
                "x": 0.5,
                "y": 0.5,
                "title": "智慧架构rightTop",
                "align": "rightTop"
            },
            {
                "x": 0.5,
                "y": 0.5,
                "title": "智慧架构rightBottom",
                "align": "rightBottom"
            }
        ]
    };
    var succ4 = {
        "url": "https://www.yd-mobile.cn/cc/智慧架构.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/5-智慧架构.jpg",
        "title": "智慧架构",
        "des": "5.智慧架构\n中控信息于2010年提出“易城市·e生活”的智慧城市理念。智慧城市，就是从全面感知、综合监控到智能管理和智慧运营的全过程",
        "lookAt": 0.2,
        "tel": 1893333,
        "bgm": music,
        "hot": [
            {
                "x": 0.54124,
                "y": 0.59859,
                "title": "荣誉墙+宣传片",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 3,
            },
            {
                "x": 0.02782,
                "y": 0.59859,
                "title": "智慧大交通",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 5,
            }
        ]
    };
    var succ5 = {
        "url": "https://www.yd-mobile.cn/cc/智慧大交通.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/6-智慧大交通.jpg",
        "title": "智慧大交通",
        "des": "6.智慧大交通\n致力于以技术手段缓解中国高速增长的交通压力，摆脱交通困局，建立“实时、准确、高效的交通综合管理服务体系”。\n1、公路交通：\n" +
        "为全国200多条高速公里、长大隧道建设了收费、监控、通信系统。\n2、城市交通：\n为全国100多个城市建设智能交通信号控制系统、交通集成管控指挥平台。\n" +
        "3、轨道交通：\n参与全国14座城市、29条线路、600多座车站的建设运营",
        "lookAt": 0.38,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.14424,
                "y": 0.57638,
                "title": "智慧架构",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 4,
            },
            {
                "x": 0.63274,
                "y": 0.57638,
                "title": "智慧大环境",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 6,
            }
        ]
    };
    var succ6 = {
        "url": "https://www.yd-mobile.cn/cc/智慧大环境.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/7-智慧大环境.jpg",
        "title": "智慧大环境",
        "des": "7.智慧大环境\n为与自然和谐共生，提出建设“绿色、低碳、舒适的可持续发展环境服务体系”。\n" +
        "1、智慧水务：\n" +
        "为全国400多家自来水和废水处理企业提供数字水厂、智慧水务管控平台\n" +
        "2、智慧建筑：\n" +
        "为全国上百家综合性医院及多个大型智慧园区、智能楼宇等建设智能建筑运维管控平台\n" +
        "3、智慧旅游：\n" +
        "成功打造了近百个智慧旅游项目，涉及旅游大数据、智慧景区、古城保护与遗产监测、智慧小镇等。\n" +
        "4、智慧管廊：\n" +
        "参与杭州、长沙、海口、唐山、苏州等10多个大中城市的综合管廊智慧化生产和管理。",
        "lookAt": 0.09,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.41909,
                "y": 0.60417,
                "title": "智慧大交通",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 5,
            },
            {
                "x": 0.91556,
                "y": 0.60417,
                "title": "业务总览",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 7,
            }
        ]
    };
    var succ7 = {
        "url": "https://www.yd-mobile.cn/cc/业务总览.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/8-业务总览.jpg",
        "title": "业务总览",
        "des": "8.业务总览\n围绕“智慧大交通”、“智慧大环境”以及新型智慧城市建设为核心业务领域，中控信息致力于“e城市，易生活”城市运行综合管理信息化解决方案的建设，在交通大脑、城市交通、公路交通、轨道交通、环境大脑、智慧水务、智慧建筑、智慧旅游、智慧管廊、新型智慧城市等各个业务领域都取得了一系列成果。\n",
        "lookAt": 0.36,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.12378,
                "y": 0.59125,
                "title": "智慧大环境",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 6,
            },
            {
                "x": 0.60291,
                "y": 0.59125,
                "title": "大数据平台展示区",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 8,
            }
        ]
    };
    var succ8 = {
        "url": "https://www.yd-mobile.cn/cc/大数据平台区.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/9-大数据平台展示区.jpg",
        "title": "大数据平台区",
        "des": "9.大数据平台区\n实时大数据展示平台，包括杭州综合交通信息指挥中心平台、杭州水务供排水一体化调度系统、轨道交通网络化运营大脑、浙江省旅游产业信息中心平台、轨道监控平台、建筑运维平台等。",
        "lookAt": 0.12,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.58299,
                "y": 0.51364,
                "title": "业务总览",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 7
            },
            {
                "x": 0.65415,
                "y": 0.51364,
                "title": "照片墙",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 9,
            },
            {
                "x":0.1222,
                "y":0.5,
                "icon":"https://www.yd-mobile.cn/cc/点我查看.gif",
                direct() {
                    navigator.videoPreviewer.preview('https://www.yd-mobile.cn/cc/mp4.mp4','中控集团宣传片');
                }
            }
        ]
    };
    var succ9 = {
        "url": "https://www.yd-mobile.cn/cc/照片墙.jpg",
        "thumbnail": "https://www.yd-mobile.cn/cc/10-照片墙.jpg",
        "title": "照片墙",
        "des": "10.照片墙\n这是中控信息官微二维码，欢迎扫描关注，了解中控信息最新动态。\n",
        "lookAt": 0.3,
        "tel": 1893333,
        "bgm": music,
        hot: [
            {
                "x": 0.14232,
                "y": 0.59657,
                "title": "大数据平台区",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 8,
            },
            {
                "x": 0.62823,
                "y": 0.59657,
                "title": "欢迎区",
                "icon": "https://www.yd-mobile.cn/cc/panorama_drop.gif",
                "clickJump": 0
            }
        ]
    };
    var all = [succ0, succ1, succ2, succ3, succ4,succ5,succ6,succ7,succ8,succ9];
    function dell(info) {
        if (info.type === 1) {
            console.log("show success 处理点击: " + info);
            all[info.panoramaIndex].hot[info.hotIndex].direct();
        } else if (info.type === 0) {
            navigator.splashscreen.hide();
        }
    }
    navigator.panorama.showByConfig(all, 0,dell);
    }
</script>

响应示例代码：

{
    "type": 0,
    "panoramaIndex":1,
    "hotIndex":1,
    "message": "全景图显示成功"
}