美文网首页
基于krpano全景场馆系统

基于krpano全景场馆系统

作者: dadalang | 来源:发表于2022-02-09 13:53 被阅读0次

项目起因

因本人从事三维开发已久,基于U3D开发的时间比较长,遇到了一些问题:例如模型制作周期长,部分插件不完善问题暴露出来,后来接触到krpano,发现利用全景展示实景可以大大节约制作成本,所以开始了krpano的研究,并基于krpano完成了一个独立项目

效果图介绍

图一. 首页进入地图导航及场景导航,语音播放,热点跳转

图二.图集展示

图三.动态热点展示,滚动字幕,3D环物展示

图四..三维物体展示

技术栈

该项目话费了一定精力,前端采用HTML+CSS+JS完成基本演示及逻辑开发,结合krapno工具进行场景生成,后台采用node+express+pm2搭建服务,支持多并发,高可用;

资源文件配置采用xml文件进行配置,hash存储方式进行索引存储

兼容性

兼容pc网页端、ios、安卓手机移动端,完成适配

最终演示地址

http://gcbwg.720l.cn/

展望

该项目属于通用型三维全景项目,核心的技术难点在于如何将krpano及原生js进行混合开发,因krpano采用的xml方式进行解析,自定义了很多标签,阅读分析存在一定的研究成本,但是梳理清楚逻辑后还是比较简单;

后面我将利用vue、node、mysql、krpano、threejs、unity搭建一套基础版本的全景管理平台,针对C端用户开发一套基础版本的编辑平台

包含功能主要有:场景、热点、图集、3D环物、视频、音频、滚动字幕、场景动效、详细面板及全景直播;

全景平台现已完成60%的基础功能,开发完成后考虑开源,欢迎大家讨论!!!有兴趣留言

相关文章

  • 基于krpano全景场馆系统

    项目起因 因本人从事三维开发已久,基于U3D开发的时间比较长,遇到了一些问题:例如模型制作周期长,部分插件不完善问...

  • krpano 全景图学习笔记

    krpano Krpano 可以方便快速的构建出全景图或全景视频(demo) 目录 Krpano DropletM...

  • krpano全景图

    本文介绍了使用krpano制作全景图的一些基础知识,krpano可以在浏览器上实现全景图效果,支持flash和HT...

  • Crosswalk for Android

    加载krpano生成的全景浏览页面时,系统自带的WebView性能不好。遂转向寻找一个第三方的高性能WebView...

  • Krpano 无缝Hotspot制作解析

    Krpano的官方示例里面有一个Example:关于如何从全景中提取并制作无缝嵌入全景展示的Hotspot的方法:...

  • krpano 720云 WKWebView加载本地html

    之前项目加载全景图片用的720云全景和krpano,生成后下载到本地用UIWebView加载,今天看到了苹果禁止了...

  • KRPano 小结 全景图制作(一)

    近期 公司有了全景图片的需求 这里仅记录自己学习KRPano的过程和经历 勿催勿赶 慢慢完善 一 什么是全景图 ...

  • ThinkPHP3.2+Krpano实现全景图

    为了实现全立体的3D全景图效果,我们采用了Krpano软件将普通鱼眼图片渲染为720°全景图。 首先下载软件Krp...

  • krpano的JavaScript接口使用

    本文主要介绍如何使用krpano的JavaScript接口,来实现播放器的展示数据以及效果添加。 创建全景播放器 ...

  • krpano的JavaScript接口使用

    本文主要介绍如何使用krpano的JavaScript接口,来实现播放器的展示数据以及效果添加。 创建全景播放器 ...

网友评论

      本文标题:基于krpano全景场馆系统

      本文链接:https://www.haomeiwen.com/subject/pcpwkrtx.html