- 动效 文章 模型
-
-
three.js使用meshdistancematerial来实现模型透明部位不投射阴影
MeshDistanceMaterial usage example for shadow controlling
-
webrtc获取摄像头和麦克风设备唯一标识
how to get media device info (unique id etc...) via js
-
three.js动态创建和更新骨骼数据代码示例
this is an online example showing how to compose bones data to skinned mesh then update for animation
-
css linear-gradient实现从中间往两边渐变透明
css linear gradient from center to sides with transparency support
-
three.js pick cube with depth test disabled
three.js depthWrite,depthTest和intersects操作测试
-
WebGIS(Web Map)基础概念简介
大地水准面 (geoid)大地水准面是海洋表面在排除风力、潮汐等其它影响,只考虑重力和自转影响下的形状,这个形状延伸过陆地,生成一个密闭的曲面。虽然我们通常说地球是一个球体或者椭球体,但是由于地球引力分布不均(因为密度不同等原因),大地水准面是一个不规则的光滑曲面。虽然不规则,但是可以近似地表示为一个椭球体...
-
Stone 3D Demo Cases
新能源虚拟城市概念展https://wow.techbrood.com/static/20210108/60580.html邻里家全景图浏览https://wow.techbrood.com/static/20210223/61008.html3D电子调音台https://wow.techbrood.com/static/20210616/61771.html高精度房地产电子沙盘https://wow.techbrood.com/static/2021012...
-
Techbrood Stone 3D IDE Release Notes
Stone 3D致力于在沉浸式网页(web3d/webxr)应用领域提供一款可以和Unity、Unreal相互竞争的轻量级引擎。Stone的体量只有Unity、Unreal的千分之一,在网页3D构建、快速概念验证和在线仿真教学方面有较大优势。
版本0.1:[2020-10-01]主流ECS架构... -
Linux Apache2如何开启gzip (deflate module) 压缩功能
检查你的网站是否启用了gzip,用chrome打开网站比如http://www.techbrood.com选中一个请求,查看Response header部分,如果没有包含Content-Encoding: gzip
那么你还没有开启gzip网页压缩功能。1.首先检查是否已安装mod_deflat... -
网页3D编辑器Stone用户手册和使用说明
Stone 3D Version 2.1 Manual
Stone 3D软著归属上海踏得信息技术有限公司,未经授权禁止用于商业用途。Stone 3D支持私有云部署、界面风格定制和模型... -
Oculus Go手柄(控制器)使用说明
Oculus Go是Facebook的一体式、3Dof VR眼镜,其手柄(即控制器)功能很简单。
电池安装
配对控制器
下载 Oculus 应用(这个需要手机科学上网)并按照屏幕上的指示将 Oculus Go 连上 WiFi。将随附的电池插入控制器中(如上图),然后轻触 Oculus 应用中的继续。按住控制... -
three.js添加场景背景和天空盒(skybox)
本文我们介绍在three.js中如何给3D场景添加背景,我们有3种方式来实现这个目的。通过html添加背景元素,这实际上一个2D背景;在three.js加载图片并设置为scene.background,这种方法的好处是可以被后处理(post-processing)效果所影响;在three.js中绘制天空盒作为背景。第一种是直接在canvas的c...
-
如何实现three.js响应式设计(消除拉伸变形和锯齿)
我们先创建一个基本的three.js场景,里面有一个cube对象。分三步,首先声明一个canvas的html元素并设置其样式:&canvas>id="c">>>width:>100%; >>>>height:>100%; >>>>display:>block; }第二步,使用three.js创建场景、光照、相机和立方体模型(cube):
import>*>as>THREE>from>'//techbrood.com/thr... -
AFrame工作原理简要说明
AFrame(a-frame)是Mozilla推出的基于Three.js的一个WebXR ( WebVR ) 应用开发引擎。其架构或设计模式为游戏引擎常用的Entity/Component/System。其总体思想是通过声明式语言的方式来创建实体、挂载组件,并通过系统(Systems)来提供基础服务如多相机系统、XR交互控制、存储系统等。其工作过程大致如下:
1)在DOM文... -
深入剖析JavaScript代码执行上下文、变量范围以及闭包(Closure)
Some concepts are important to grok before you can grok closures. One of them is the execution context.This article has a very good primer on Execution Context. To quote the article:When code is ru...
-
WebXR桌面浏览器模拟器使用简介
WebXR标准最近(10月份)刚刚发布了工作版本(Working Draft),是一个重要的里程碑。由于WebXR的体验依赖于头戴设备,因此其应用程序开发和调试比较困难,为了测试你的应用程序在各种情况下的响应,你得拥有大量的设备:移动设备、3dof设备、6dof设备等等(比...
-
NodeJS中的module概念以及module.exports和exports的区别
NodeJS为js引入了模块化的一些概念,html里面可以引入js或css,甚至css也可以通过@import来引入其他css文件,而JS一直缺少这个机制,这使得JS很难像其他语言如java/python/php那样来编写模块化的应用程序。因此ES6以及NodeJS都对这方面特性做了增强。NodeJS为每个单独的JS文件生成了默认的Module对象,该对象用来表示文件执...
-
php curl大文件上传遇到502或504错误
使用php的curlfile上传大文件到远端服务器,遇到502错误。原因可能是超时或者内存超出,需要修改nginx、php.ini和php-fpm.conf中的一些配置。修改php.ini(注意console下和网页运行环境下使用的php.ini文件通常是不同的)中的输出缓冲参数如下://output_buffering>=>4096 output_buffering>=>On>//>On表示无限制 max_e...
-
HTML、JavaScript和GLSL编码规范
HTML编码规范
- 始终将文档类型声明为文档中的第一行:>&!doctype>html&p&div&p...>&/p&br>/&div>class="..."&div>class="..."&div>class="..."> >>&meta>charset="UTF-8">> >>&titleSyntax>and>Coding>Style&/title &/head&!-->This>is>a>com...
-
WebGL 2D纹理坐标到3D顶点坐标的映射
webgl纹理映射用来把图片贴到模型的材料表面,给模型添加丰富的细节。该方法的核心是把一张二维的图片映射到三维的坐标空间去,也就是为每一个3d顶点找到其相应的纹理像素。要想实现这样的目标,显然需要先把3d模型展开为2d的平面,然后才可以和2d贴图建立对等的映射关系。我们这里以一个最简单的平面来观察这个映射的过程...
-
WebXR基本概念和应用程序开发简介
XR是VR,AR和MR的统称,VR,AR是从感官体验的角度来区分的,
VR是用户借助外设输入输出(头戴、手柄、体感、运动感知等软硬件系统)来和纯虚拟场景的交互体验,AR也是用户借助外设来体验额外的虚拟内容,区别是虚拟内容是叠加在真实世界上,其方式可以是通过透射或者视频叠加。WebXR是基于网页的XR应用程序,可以用来支持... -
1年前
-
1年前
-
1年前
-
2年前
-
3年前
-
5年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
6年前
-
© 2023 TechBrood Co. All rights reserved 沪ICP备14011478号