krpano HTML5全景漫游

目前有个插件叫krpano HTML5 Viewer可以实现全景展示,官网都是英文,而且网上资料也比较少些,需要看看官网实例、文档。

下载地址:http://www.krpano.com/

引用一下别人的博客:http://my.oschina.net/u/591525/blog/158572

Krpano功能介绍
Krpano viewer的主程序所使用的XML文件十分简洁.默认情况下仅可以做到场景的载入。其他所有功能,都以插件的
形式实现.而每个插件.既可以在自己的XML文件进行配置。 然后供主程序XML文件调用.也可以在主程序的XML文件
中直接[标签引入并进行配置。这样做的好处就是功能明确,结构清晰,便于扩展,利于维护。
Krpano的所有标签如下: 

标签:载人其他的xml文件。
标签:在装载全景图片的过程中显示一个小的全景图。
标签:载人图片。
标签:存储当前视的信息。
标签:定义全景图中被展示的区域
标签:定义渲染的质量和性能。
标签:鼠标键盘的控制设置。
标签:自定义光标的样式。
标签:当无用户交互时.自动扭曲/移动,缩放。
标签:载人其他flash程序,图片或者按钮,图标
等。
标签:设置热点。
标签:设置事件的响应。
标签:定义行为.需要用脚本语言解释器解释。
标签:自定义鼠标右键菜单。
标签:设置装载时过程。
标签:设置下载或者decode时的图片。
标签:设置内存使用情况。
标签:设置安全性。
标签:定义样式。
标签:定义一个镜头光晕样式。
标签:定义一个镜头光晕。
标签:存储一些数据
标签:定义场景。
代码解析:

   1.

表示页面会生成一个div层,有宽高、位置布局属性。可以根据自己业务在界面进行布局,如果需要在图片上做点击事件需要加onclick属性如下:

loadscene是插件自带方法(载入指定的一个全景),只需要传一个全景标签的name即可。

2.执行脚本语句

    skin_addthumbs();
    skin_onresize();
    skin_updatescroll();

3.手机端用到陀螺仪和重力感应,需要插件gyro.js:

4.html页面需要加入标签手机端需要适应屏幕:

  
  

本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,请添加站长微信举报,一经查实,本站将立刻删除。

如若转载,请注明出处:https://www.ibjoo.com/300.html

(1)
上一篇 2020年5月5日 下午3:45
下一篇 2020年5月5日 下午3:46

相关推荐

  • mxreality.js 免费开源的全景图/全景视频/VR 直播播放器介绍

    [2018-10-20 重要更新]支持VR直播功能支持全景视频poster支持全景图和视频和场景之间随意切换全景模式切换回默认主视角播放列表  优点: 1、全景图支持全景模式和VR模式 2、支持网页端全景图补天功能,有效去除顶部和底部拼接留下的痕迹、做出真正完美的产品 3、全景VR图是全景VR视频支持小行星效果,还提供控制效果测试,可以根据自己需要…

    VR全景教程 2020年5月5日
    16500
  • H5全景图-朋友圈全景图-720°全景-VR —- 项目简单分析

    这里我们主要看一下生成的项目中都有什么。源码中都有什么,如何去自定义 我们先只导入一张全景图,不做任何设置 然后导出项目。(为了方便,我将其项目地址和 生成的html地址都设置在一起) 我们看看都有什么 文件夹images:软件切好的图片存放目录pano2vr_player.js :Pano2VR自动生成的JavaScript脚本,是整个项目的核心test1…

    VR全景教程 2020年5月5日
    16200
  • 如何把图片自动生成全景图?用什么拼接/制作软件?

    相比于传统平面图片,相信看过360/720VR全景图的朋友们,都会更加喜欢全景图震撼的“上帝视角”既视感。那么,如何把图片自动生成全景图?用什么拼接/制作软件?其实,把图片转为vr全景图并不难,首先我们得明白用普通平面图合成VR全景图的原理。 1、360/720VR全景图制作原理 如上图所示,我们想要制作720VR全景图,首先我们要把上下左右四面八方的视角都…

    2020年4月23日
    20400
  • 全景漫游里面怎么添加百度地图?

      VR云平台里面全景漫游里面不仅可以添加百度地图、缩略图、上下场景切换,还有点赞留言的功能,另外也可以通过手机扫描二维码分享到微信朋友圈或者微博里面。  那么用户怎么使用VR云平台呢?  首先,用户需要注册登入平台,登入之后就可以上传全景图,也可以通过我们的拼接软件——制作全景图;另外也可以在线制作全景漫游。  上传好全景图和全景漫游之后,就可以等待我们的…

    VR全景教程 2020年5月5日
    9300
  • 如何制作珠宝360度全景效果图?3D环物拍摄流程详解

    珠宝钻石首饰对女生拥有天然吸引力,除了璀璨好看,珠宝钻石等往往是对美好爱情的寓意象征。随着移动互联网及电子商务的普及,越来越多的高端珠宝钻石等奢侈品品牌也纷纷开拓互联网营销市场。如何把珠宝钻石完美的设计加工在线上呈现出来?360度VR全景效果图无疑是各大品牌店家首选。那么,如何制作珠宝360度全景效果图?下面为大家详解3D环物展示拍摄制作原理及流程。 什么是…

    2020年4月23日
    13500

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注

工具推荐
公众号
公众号
分享本页
返回顶部
特别提示:欢迎收藏&使用市场工具导航,如您有任何建议或好用工具推荐,请留言告知我们。谢谢~