通过JS动态切换大场景xml

我们在利用krpano去制作720全景图的时候,通常会遇到需要在两个大场景下切换的情况,或许我们可以通过不同链接去跳转,但是这样用户的体验效果极差,因此我们可以通过JS动态切换大场景xml,具体步骤如下:

第一步:将需要切换的场景 **.xml、panos里面的文件复制到相应目录下

第二步:在tour.xml下的scene标签内定义一个可点击的热点

<hotspot name="video" url="skin/vtourskin_mapspotactive.png" scale="0.4" ath="-162.243" atv="40.839" onclick="js(loadpano('zhongye.xml','scene_lqc'););" />

第三步:在tour.html 内定义点击事件

<div id="pano" style="width:100%;height:100%;">
    <noscript><table style="width:100%;height:100%;"><tr style="vertical-align:middle;"><td><div style="text-align:center;">ERROR:<br/><br/>Javascript not activated<br/><br/></div></td></tr></table></noscript>
        <script>
            var krpano = null;
                embedpano({
                    swf: "tour.swf",
                    xml: "tour.xml",
                    target: "pano",
                    html5: "auto",
                    mobilescale: 1.0,
                    passQueryParameters: true,
                    onready: krpano_onready_callback
                });

            function krpano_onready_callback(krpano_interface) {
                krpano = krpano_interface;
            }

            function loadpano(xmlname,sceneName) {
                    if(krpano) {    
                                                 //动态切换xml,xmlname为tour.xml传过来的值 
                                                 krpano.call("loadpano(" + xmlname + ", null, MERGE, BLEND(0.5));"); 
                                                  //sceneName为切换后加载的第一个场景
                                                 krpano.call("loadscene('" + sceneName + "')"); 
                                       } 
                        } 
              </script>
  </div>
  • 4
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

爱蹦跶的大A阿

你的打赏就是我蹦跶的动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值