查看详情

【译】人眼对 AR 空间的理解

原文链接: https://uxdesign.cc/human-eyes-understanding-of-space-for-augmented-reality-d5ce4d9fa37b @Kore 从工程的角度来看,我们的眼睛是精密的光学传感器,其结构长期以来一直被用作设计相机的蓝图。光通过一系列光学元件进入,其中折射和聚焦都发生在这里。光圈控制通过光圈的光量。随后的光图案落在图像平面上,电信号从该图像平面发送到大脑。然后将这些信号解码为图像。尽管眼睛的功能本身就是一个有趣的话题,但是为了简单起见,我还是自由地忽略了眼睛如何工作的很大一部分。但是,我敢肯定,您会有所了解。 可见光谱 人类的视觉离不开光的存在。光是电磁辐射的一种形式,是刺激人类视觉的关键。这种辐射以波的形式在空间中移动,并能够刺激视网膜产生视觉感。电磁辐射根据其波长进行分类,波长是波的两个波峰之间的距离。尽管整个电磁频谱都包括无线电波,红外线,X射线和其他波类型,但人眼仅对380-740纳米之间的款窄带*敏感。这称为可见光谱。 1纳米= 1米的十亿分之一 人眼的基本特性 视场角(FOV) 它定义为两只眼睛都能看到的图像的总角度大小。平均而言,水平双眼FOV为200度,其中120度为双眼重叠。双眼重叠对于进一步讨论的立体和其他深度提示尤其重要。垂直视场约为130度。 瞳距(IPD) 顾名思义,它是眼睛的瞳孔之间的距离,是双目观察系统的一个非常重要的考虑因素。这个距离因性别和种族而异。不正确的IPD可能会导致不良的眼镜对准,图像失真,眼睛疲劳和头痛。成人的平均IPD约为63mm, 详情 »

查看详情

如何免费阅读 Medium 文章

Step1: 下载 Chrome 浏览器; Step2: (跨过山和大海)后打开浏览器,浏览 Medium ,然后打开你想阅读的文章;你可能会看到下面提示; step3: 没关系,接下来,你可以使用无痕模式,打开 Chrome 的无痕模式,然后将 url 粘贴进去就行了。 温馨提示: 如果有能力可以付费订阅的还是可以尽力付费 每月5刀,也不是很贵,也算是鼓励创作者。 详情 »

查看详情

AR/VR 显示技术原理 (下)

原文地址: https://medium.com/hackernoon/fundamentals-of-display-technologies-for-augmented-and-virtual-reality-c88e4b9b0895 @Kore 之前在AR/VR 显示技术原理-上篇翻译过关于人类视觉基本原理和对于空间的理解,这一部分主要翻译现有显示技术的硬件和底层材料使用。 显像技术 图像显示技术在过去一些年发展的极为迅速。高端的 CRT 已经被四种主要的技术所取代: 液晶显示器(LCD) LCD在高清电视中很常见,并且自1980年代以来一直用于AR/VR显示器中。这种显示类型由包含液晶分子的单元阵列组成,该单元夹在两个偏振片之间。这种装置安置于在于数百万个晶体管的薄玻璃基板之间。对于彩色LCD,将包含红色,绿色和蓝色滤光片的附加基板,放置在该基板的每个单元上方。单个RGB液晶单元称为子像素。三个子像素形成一个像素。 电流流过玻璃材料,改变电流可以使LCD调节光的通过以产生精确的颜色。如果所有子像素都完全打开,则会产生白光。 液晶单元不发光,需要背光。液晶单元只能改变光的通过以产生所需的颜色并随后产生图像。 发光二极管(OLED) 此显示技术基于有机(碳和氢键结合)材料,当施加电流时会发光。这是一种固态显示技术,其中通过有机片的能量以光的形式释放,也称为电致发光。可以通过仔细设置有机发光来控制颜色,但是大多数制造商在OLED堆栈中添加了红色,绿色和蓝色薄膜。OLED面板有两种类型: 被动矩阵有机电激发光二极管(PMOLED): 与CRT一样,此显示类型由复杂的电子网格组成,以按顺序控制每行中的各个像素。它不包含使更新速度变慢并且保持像素状态高功耗的存储电容器。 详情 »

查看详情

《转》着色器语言 GLSL (opengl-shader-language)入门大全

基本类型 void 空类型,即不返回任何值 bool 布尔类型 true,false int 带符号的整数 signed integer float 带符号的浮点数 floating scalar vec2, vec3, vec4 n维浮点数向量 n-component floating point vector bvec2, bvec3, bvec4 n维布尔向量 Boolean vector ivec2, ivec3, ivec4 n维整数向量 signed integer vector mat2, mat3, mat4 2x2, 3x3, 4x4 浮点数矩阵 float matrix sampler2D 2D纹理 a 2D texture samplerCube 盒纹理 cube mapped texture 详情 »

查看详情

Getting Started with vue-core-video-player to create video player

I have focused on the video player in the last few years. With the growth of video content and bandwidth, so many websites using video to give users more information. So I hope this vue.js plugin helps you solve it. vue-core-video-player is a lightweight video player for Vue.js. It is easy to get started. 详情 »

查看详情

使用 chrome://media-internals 更好的进行音视频 Debug

随着短视频和在线教育办公的兴起,我们非常倚重浏览器的音视频项目开发。 Chrome 提供了一款非常好的内部状态栏,帮助我们去了解当前音视频的编码,buffer 状态等信息。 我们可以随机打开两个在线视频播放网站比如: https://www.bilibili.com/bangumi/play/ep313573 https://v.youku.com/v_show/id_XMzQ2OTk2Mjky.html 然后我们可以在浏览器新建 tab 输入 chrome://media-internals/ 我们可以看到四个 tab Players 当前播放视频的日志信息 Audio 当前音频的播放日志信息 Video Capture 当前摄像头的状况 Audio Focus 当前音频播放的 Session 其中我们主要关心前两个 Tab。 在 Players 我们是一个看到一个历史纪录,我们可以根据视频的 CDN 源找到当前正在播放的视频。然后点击,最底部我们可以在最底部看到两栏,Player Properties 和 Log。 详情 »

查看详情

[转]10种常见的软件架构模式

原文地址: https://www.cnblogs.com/IcanFixIt/p/7518146.html Tips 原文作者:Vijini Mallawaarachchi 原文地址:10 Common Software Architectural Patterns in a nutshell 有没有想过要设计多大的企业规模系统?在主要的软件开发开始之前,我们必须选择一个合适的体系结构,它将为我们提供所需的功能和质量属性。因此,在将它们应用到我们的设计之前,我们应该了解不同的体系结构。 什么是架构模式? 根据维基百科中的定义: 架构模式是一个通用的、可重用的解决方案,用于在给定上下文中的软件体系结构中经常出现的问题。架构模式与软件设计模式类似,但具有更广泛的范围。 在本文中,将简要地解释以下10种常见的体系架构模式,以及它们的用法、优缺点。 分层模式(Lyered pattern) 客户端-服务器模式(Client-server pattern) 主从设备模式(Master-slave pattern) 管道-过滤器模式(Pipe-filter pattern) 代理模式(Broker pattern) 点对点模式( 详情 »

查看详情

terraform aws_lb_listener 配置详解

terraform 是一款通过代码来组织基础架构的工具。 Use Infrastructure as Code to provision and manage any cloud, infrastructure, or service 如果你是用的 AWS 的整套服务,你可以通过它实现对 S3, ECR, web load balancer 等服务的配置。当然它除了支持 AWS 也支持 阿里云 Google Cloud 等平台。非常适合不需要太多运维知识的工程师。 今天主要是我们需要配置域名和应用的绑定。比如我们部署了某个 Web 服务,实现域名和应用的关联,我们需要用到 aws_lb_listener 官方有提供一段参考,类似这样的: resource "aws_lb_listener_rule" "static" { listener_arn 详情 »

查看详情

JS 的原地(in-place)算法实践

In computer science, an in-place algorithm is an algorithm which transforms input using no auxiliary data structure. However a small amount of extra storage space is allowed for auxiliary variables. The input is usually overwritten by the output as the algorithm executes. In-place algorithm updates input sequence only through replacement or swapping of elements. An algorithm 详情 »

查看详情

聊聊 Web 视频播放的画中画模式

Chrome 在升级到 70 的时候开始对视频播放的画中画模式开始支持了,用户在浏览器 Web 页面可以通过 画中画的形式强当前画面停留在屏幕正上方,无论你在使用其他软件还是切到其他 Tab ,都可以看到当前画面。 最新的 caniuse 我们可以看到已经覆盖了很多了浏览器版本,包括 最新的 Safari 甚至移动 Android 的 Chrome 浏览器。 特征检测 我们可以通过 video 元素上的 requestPictureInPicture 的方法以及 document.pictureInPictureElement 来判断浏览器是否支持画中画模式。 if ('pictureInPictureEnabled' in document) { // do something } else { // not support } if (typeof videoEl.requestPictureInPicture === 'function') { // do something } else { // not support } API 调用 我们可以通过调用 requestPictureInPicture 来实现画中画播放模式。 someBtn. 详情 »