专业解释 什么是OpenGL OpenGL(Open Graphics Library即开放图形库或者“开放式图形库”)是用于渲染2D.3D矢量图形的跨语言.跨平台的应用程序编程接口(API). 这个接口由近350个不同的函数调用组成,用来从简单的图形比特绘制复杂的三维景象. OpenGL ES (OpenGL for Embedded Systems) 是 OpenGL 三维图形 API 的子集,针对手机.PDA和游戏主机等嵌入式设备而设计. 该API由Khronos集团定义推广(Khrono…
vue防重复点击(指令实现) 快速点击按钮会重复多次调用接口,防止出现这样的情况 全局定义,方便调用 新建plugins.js export default { install (Vue) { // 防重复点击(指令实现) Vue.directive('preventReClick', { inserted (el, binding) { el.addEventListener('click', () => { if (!el.disabled) { el.disabled = true set…
WebGL three.js学习笔记 6种类型的纹理介绍及应用 本文所使用到的demo演示: 高光贴图Demo演示 反光效果Demo演示(因为是加载的模型,所以速度会慢) (一)普通纹理 计算机图形学中的纹理既包括通常意义上物体表面的纹理即使物体表面呈现凹凸不平的沟纹,同时也包括在物体的光滑表面上的彩色图案,所谓的纹理映射就是在物体的表面上绘制彩色的图案. 在three.js中使用纹理可以实现很多不同的效果,但是最基本的就是为网格体的每个像素指定颜色.等同于将一张纹理图片应用在一个几何体的材质上…
Junit使用的超简单介绍 前言:我对Junit了解的并不多,只是今天突然听到有人提到了它,而且现在时间还早,所以我觉得我不妨更一篇关于Junit4的超级超级简单的用法,全当是为了省去看官网demo的时间吧.这里仅仅谈@Test夹具. 一.JUnit超级简介 1 . 官网 http://junit.org 或者 http://junit.org/junit4/ 没有比官网更权威的介绍了. 上图中的4.12,4.11等是JUnit4的版本.JUnit3是必须继承junit.framework.Te…
ECharts.js 超简单入门(本质canvas) 一.总结 一句话总结:echarts这些图标的本质都是canvas. 二.ECharts.js学习(一) 简单入门 EChart.js 简单入门 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart   这个是Visual Studio里的自带控件,使用比较简单,不过数据这块需要在后台绑定. ichartjs 是一款基于HTML5的图形库.使用纯javascript语言, 利用HTM…
序: 上节课已经详细描述了普通机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10473021.html) 紧接着上节课的内容 我们这节可来详细讲解机房微模块的三维实现 首先我们先看一下整体的效果图: 这是单个微模块的模拟最后的系统效果 下面我们进入正文,详细讲解创建过程(机房的以及其它动力环境的创建 前面的课程已经讲诉 这里不在累赘描述) 一.创建组件 正所谓造车得现有轮子,那么搭建整个机房得先创建一个个小的组件,最后组合成大的模块.我们的步骤是…
“哥,你又来啦?”“是啊,我随便逛逛.”“别介啊……给我20分钟,成不?”“5分钟吧,我很忙的.”“不行,20分钟,不然我真很难跟你讲清楚.”“好吧……”“行,那进来吧,咱好好聊聊” 一.我们讲什么? 我们讲两个东西:1.WebGL背后的工作原理是什么?2.以Three.js为例,讲述框架在背后扮演什么样的角色? 二.我们为什么要了解原理? 我们假定你对WebGL已经有一定了解,或者用Three.js做过了一些东西,这个时候,你可能碰到了这样一些问题:1.很多东西还是做不出来,甚至没有任何思路:…
一.我们讲什么? 我们讲两个东西:1.WebGL背后的工作原理是什么?2.以Three.js为例,讲述框架在背后扮演什么样的角色? 二.我们为什么要了解原理? 我们假定你对WebGL已经有一定了解,或者用Three.js做过了一些东西,这个时候,你可能碰到了这样一些问题:1.很多东西还是做不出来,甚至没有任何思路:2.碰到bug无法解决,甚至没有方向:3.性能出现问题,完全不知道如何去优化.这个时候,我们需要了解更多. 三.先了解一个基础概念 1.什么是矩阵?简单说来,矩阵用于坐标变换,如下图:…
使用WebGL + Three.js制作动画场景 3D图像,技术,打造产品,还有互联网:这些只是我爱好的一小部分. 现在,感谢WebGL的出现-一个新的JavaScriptAPI,它可以在不依赖任何插件的情况下渲染浏览器中的3D图像-这让3D渲染操作变得异常简单. 随着虚拟现实和增强现实应用的发展,大型厂商们开始转向数字化触觉体验,这是令人动心的一项技术. 或者,至少那些已经投资的人这一年还抱有希望-11亿美金流入VR和AR领域. 从Abbey Road Studios的谷歌交互之旅到拍摄Dea…
WebGL学习----Three.js学习笔记(1) webgl介绍 WebGL是一种3D绘图协议,它把JavaScript和OpenGL ES 2.0结合在一起,通过增加OpenGL ES 2.0的一个JavaScript绑定,WebGL可以为HTML5 Canvas提供硬件3D加速渲染. WebGL技术标准免去了开发网页专用渲染插件的麻烦,可被用于创建具有复杂3D结构的网站页面,甚至可以用来设计3D网页游戏. 原生的WebGl比较复杂,主要通过对顶点着色器和片元着色器的操作,来实现渲染,但实…