实现一个三维全景;  然后思考优化问题;

于是我问了下webgl技术交流群朋友有啥解决方案;

对于krpano.js 的了解,只是知道百度全景用了这个技术;

最后还是选择了群友给出的three.js 的 css3d方案;  做了一个横滨之夜的全景demo;

基本思路是:

1.正方体全景,贴上六面纹理;

           2.鼠标移动的视觉调整;

  

说明:

        1.demo: https://thinkia.github.io/threejs_/test/test1-panorama/index.html

     2.code:  https://github.com/Thinkia/threejs_/blob/master/test/test1-panorama/index.html   

       3.素材来自  http://www.humus.name/     仅供学习与交流

总结 :     我发现用  github的 io  展示demo  响应 的 时间特别慢 ,  根本原因就是优化不够吧 ?

我在网上查了下资料

优化办法分为五步:

1.加载优化: 2.脚本执行优化 3.css优化  4.js执行优化 5.渲染优化

参考文章:  https://www.cnblogs.com/xy-milu/p/6091234.html

目前还未一一 结合实际情况测试;

                                                                                                            Thinkia  

                                                                                                         

            

three.js 实现全景以及优化(1)的更多相关文章

  1. three.js 实现全景以及优化(2)

    继昨天全景实现后,再做了一个全景图切换实验; code:https://github.com/Thinkia/threejs_/blob/master/test/test1-panorama/inde ...

  2. 客户端JS性能的一些优化的小技巧

    下面是一些关于客户端JS性能的一些优化的小技巧:1.[顶]关于JS的循环,循环是一种常用的流程控制.JS提供了三种循环:for(;;). while().for(in).在这三种循环中 for(in) ...

  3. js资源加载优化

    互联网应用或者访问量大的应用,对js的加载优化是不可少的.下面记录几种优化方法 CDN  + 浏览器缓存 CDN(content delivery network)内容分发网络, 最传统的优化方式.其 ...

  4. JS日历控件优化(增加时分秒)

    JS日历控件优化      在今年7月份时候 写了一篇关于 "JS日历控件" 的文章 , 当时只支持 年月日 的日历控件,现在优化如下:      1. 在原基础上 支持 yyyy ...

  5. Vue.Js的用户体验优化

    一次基于Vue.Js的用户体验优化   一.写在前面 半年以前,第一次在项目上实践VueJs,由于在那之前,没有Angular,avalon等框架的实践经验,所以在Vue的使用上,没有给自己总结出更多 ...

  6. vue.js的app.js太大怎么优化?

    vue.js的app.js太大怎么优化? # http://nginx.org/en/docs/http/ngx_http_gzip_module.htmlgzip on;gzip_min_lengt ...

  7. 基于Three.js的全景---photo-sphere-viewer

    以前公司其他几个前端做全景都是用软件生成,由于本人比较懒,不想去折腾那个软件,于是乎就有了下面的事...... 这个是基于three.js的全景插件  photo-sphere-viewer.js  ...

  8. JS学习笔记12_优化

    一.可维护性优化 1.添加注释 注释能够增强代码的可读性以及可维护性,当然,理想情况是满满的注释,但这不太现实.所以我们只需要在一些关键的地方添上注释: 函数和方法:尤其是返回值,因为直接看不出来 大 ...

  9. 一次基于Vue.Js用户体验的优化

    .mytitle { background: #2B6695; color: white; font-family: "微软雅黑", "宋体", "黑 ...

随机推荐

  1. 使用eclipse写C

    C终究还是程序员进阶少不了坎,熟悉nginx ,深入学习php等最后都逃不过C,那为何不去拥抱呢...'='',c对我来说也是老朋友了,但是那时做 硬件作比赛而且比较浅显,现在决定还是 重新试试吧,, ...

  2. linux分析apache日志获取最多访问的前10个IP

    apache日志分析可以获得很多有用的信息,现在来试试最基本的,获取最多访问的前10个IP地址及访问次数. 既然是统计,那么awk是必不可少的,好用而高效. 命令如下: awk '{a[$1] += ...

  3. 最简化搭建yum仓库

    在使用rpm安装软件包时,时常会遇到一些软件依赖性问题,如果是简单的一两个依赖性还是可以手动解决.要是出现大量的依赖性问题的话会让增大工作量.yum是一个很好的前端程序,可解决软件包相关依赖性,可在多 ...

  4. SDP(9):MongoDB-Scala - data access and modeling

    MongoDB是一种文件型数据库,对数据格式没有硬性要求,所以可以实现灵活多变的数据存储和读取.MongoDB又是一种分布式数据库,与传统关系数据库不同的是,分布式数据库不支持table-join,所 ...

  5. 嵌入式linux------SDL移植(am335x下显示bmp图片)

    #include<stdio.h> #include "/usr/local/ffmpeg_arm/include/SDL/SDL.h" char *bmp_name[ ...

  6. freemarker之include指令

    freemarker之include指令 1.父页面ftl <html> <head> <meta http-equiv="content-type" ...

  7. C#之AES256位加密解密

    密码学中的高级加密标准(Advanced Encryption Standard,AES),又称Rijndael加密法,是美国联邦政府采用的一种区块加密标准.这个标准用来替代原先的DES,已经被多方分 ...

  8. Cortex-M3

    大家听说过Cortex-M3吗?在嵌入式处理器的世界,cortex-M3是一位人见人爱的后生.它的成本和功耗低,可配置性很高.如今,很多ARM的工程师加入了cortex-M3的学习与开发中,WIZne ...

  9. 【转载】[ORACLE]详解not in与not exists的区别与用法

    在网上搜了下关于oracle中not exists和not in性能的比较,发现没有描述的太全面的,可能是问题太简单了,达人们都不屑于解释吧.于是自己花了点时间,试图把这个问题简单描述清楚,其实归根结 ...

  10. (luogu4180) [Beijing2010组队]次小生成树Tree

    严格次小生成树 首先看看如果不严格我们怎么办. 非严格次小生成树怎么做 由此,我们发现一个结论,求非严格次小生成树,只需要先用kruskal算法求得最小生成树,然后暴力枚举非树边,替换路径最大边即可. ...