鹦鹉

啦啦啦 。。。。。啦啦啦啦

WebGL中从物体坐标到屏幕坐标之间的变换过程 模型矩阵、视图矩阵、投影矩阵

模型视图投影矩阵的作用,就是将顶点从局部坐标系转化到规范立方体(Canonical View Volnme)中。 **模型视图投影矩阵=投影矩阵×视图矩阵×模型矩阵。 模型矩阵将顶点从局部坐标系转化到世界坐标系中, 视图矩阵将顶点从世界坐标系转化到视图坐标系下, 而投影矩阵将顶点从视图坐标...

2018-12-17 17:52:53

阅读数:45

评论数:0

图解WebGL&Three.js工作原理

1、什么是矩阵? 简单说来,矩阵用于坐标变换,如下图: 2、那它具体是怎么变换的呢,如下图: 3、举个实例,将坐标平移2,如下图: 如果这时候,你还是没有理解,没有关系,你只需要知道,矩阵用于坐标变换。 四、WebGL的工作原理 4.1、WebGL API 在了解一门新技术前,我们都会先看看...

2018-12-17 17:35:26

阅读数:23

评论数:0

Chrome开发者工具详解(3)-Timeline面板

Timeline面板 Timeline面板是整个面板里面最复杂的一个面板,涉及的东西比较多。可以利用这个面板来记录和分析网页运行过程中的所有活动行为信息。 你可以充分利用这个面板来分析你的网页的程序性能问题。 概述 下图是从Google官方网站中介绍Timeline面板的图贴到这里,该面板主要包...

2018-11-28 11:03:53

阅读数:30

评论数:0

数据结构常用排序(冒泡,选择,插入排序)

冒泡排序   冒泡排序是由两个for循环构成,第一个for循环的变量 j 表示总共需要多少轮比较,第二个for循环的变量 i 表示每轮参与比较的元素下标【0,1,…,length-i】, 因为每轮比较都会出现一个最大值放在最右边,所以每轮比较后的元素个数都会少一个,这也是为什么 j 的范围是逐渐减...

2018-11-27 14:32:40

阅读数:7

评论数:0

闭包

闭包是函数和声明该函数的词法环境的组合。 词法作用域节 考虑如下情况: function init() { var name = "Mozilla"; // name 是一个被 init 创建的局部变量 function displayName() { // d...

2018-11-22 10:18:00

阅读数:9

评论数:0

大规模WebGL应用引发浏览器崩溃的几种情况及解决办法

一般的Web应用基本上不会导致浏览器崩溃,写Javascript代码也不需要管理内存资源,基本也不需要考虑内存“泄露”的问题。随着H5的崛起,越来越多的原本在桌面端的软件也改头换面迁移到Web上来,比如三维图形类的应用。在Web端显示大规模三维模型不仅仅是三维显示引擎的问题,也涉及到数据组织、任务...

2018-11-21 11:44:35

阅读数:70

评论数:0

ES6的开发环境搭建

在搭建es6开发环境之前,先简单介绍一下es6。 ECMAScript 6.0(以下简称 ES6)是 JavaScript 语言的下一代标准,已经在2015年6月正式发布了。它的目标,是使得 JavaScript 语言可以用来编写复杂的大型应用程序,成为企业级开发语言。 我们为什么要使用es6?e...

2018-11-16 14:37:19

阅读数:5

评论数:0

video.js的使用

更多详情:http://www.cnblogs.com/afrog/p/4115377.html 最近项目中的视频功能,需要做到浏览器全兼容,所以之前用html5实现的视频功能就需要进行改造了。在网上翻了个遍,试来试去,在所有的视频播放器中,就数它最实际了。首先我们来看看它的优点: 1.它是开源...

2018-10-23 17:05:26

阅读数:87

评论数:0

threejs的shader材质 颜色混合函数mix

float mix(floatx,float y,float a ) 返回x和y 的线性混合,即x(1-a)+ya three.js webgl - shader [Monjori] <div id="containe...

2018-10-17 15:51:42

阅读数:96

评论数:0

GLSL 内建函数

OpenGL ES着色语言为标量和向量操作定义了一套内建便利函数。有些内建函数可以用在多个类型的着色器中,有些是针对固定硬件的,所以这部分只能用在某个特定的着色器上。     &...

2018-10-16 10:27:22

阅读数:8

评论数:0

JS内存泄漏排查方法(Chrome Profiles)

JS内存泄漏排查方法(Chrome Profiles) Google Chrome浏览器提供了非常强大的JS调试工具,Heap Profiling便是其中一个。Heap Profiling可以记录当前的堆内存(heap)快照,并生成对象的描述文件,该描述文件给出了当时JS运行所用到的所有对象,以及...

2018-10-12 11:14:22

阅读数:31

评论数:0

webgl 学习第一节(绘制一个点)

最终的效果 相关的HTML <!DOCTYPE html> <html lang="en"> <!-- 烟花效果 --&amp...

2018-07-05 17:43:44

阅读数:345

评论数:0

github上创建新的工程

echo “# -fbxloader” >> README.mdecho “# -fbxloader” >> README.md git initgit init git add README.mdgi...

2018-06-26 10:10:12

阅读数:46

评论数:0

微信的小程序和小游戏的区别

小游戏是小程序的一个类目,小游戏是微信开放给小程序的更多的能力,让小程序开发者有了开发游戏的能力。小游戏没有WXSS、WXML、多页面等内容,但加了一些渲染、文件系统以及后台多线程的功能。 小游戏的运行环境是小程序环境的扩展,基本思路也是封装必要的 WEB 接口提供给用户,尽可能追求和 WEB ...

2018-06-13 15:09:39

阅读数:2054

评论数:0

three后期处理与多通道渲染

1.设置后期处理 设置Three.js库为后期处理做准备,我们需要通过以下步骤对当前的配置进行修改: 1)创建一个EffectComposer(效果组合器)对象,然后在该对象上添加后期处理通道。 2)配置该对象,使它可以渲染我们的场景,并应用额外的后期处理步骤。 3)在render循环中,...

2018-04-19 09:29:04

阅读数:691

评论数:0

console.log() 和console.dir()区别

console.log()可以取代alert()或document.write(),在网页脚本中使用console.log()时,会在浏览器控制台打印出信息。 console.dir()可以显示一个对象所有的属性和方法。...

2018-04-12 11:22:58

阅读数:192

评论数:0

webgl着色器

webgl着色器的原理 注意:着色器使用类似于C的OpenGL ES 着色器语言(GLSL ES)来编写的。因为着色器程序代码必须预先处理成单个字符串的形式,所以我们用+号将多行字符串连城一个长字符串。每一行以\n结束,这是由于当着色器内部出错时,就能获取出错的行号,这对于检查源代码中的错...

2018-04-04 17:33:14

阅读数:97

评论数:0

touch事件中的touches、targetTouches和changedTouches详解

touches: 当前屏幕上所有触摸点的列表; targetTouches: 当前对象上所有触摸点的列表; changedTouches: 涉及当前(引发)事件的触摸点的列表 通过一个例子来区分一下触摸事件中的这三个属性: 用一个手指接触屏幕,触发事件,此时这三个属性有相同的值。 用第二...

2018-03-29 18:50:19

阅读数:92

评论数:0

移动端的touch事件

移动端的touch事件 $("body").on("touchstart", function (e) { e.preventDefault(); startY = e.original...

2018-03-29 18:46:24

阅读数:48

评论数:0

鼠标点击获取3维坐标three

鼠标点击的屏幕坐标转换到视点坐标系 var me = this, view = this.getView(), viewModel = this.getViewModel(); var text = view.down(‘[name=Pickuppos]’).getText(...

2018-03-19 19:38:40

阅读数:754

评论数:0

提示
确定要删除当前文章?
取消 删除
关闭
关闭