WebVR与WebXR

已于 2023-02-16 10:27:21 修改
阅读量888 收藏 2
点赞数
分类专栏： Cesium JS 文章标签： VR WebVR WebXR Cesium Emulator
于 2022-11-21 16:59:16 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/wml00000/article/details/127968352
版权
JS 同时被 2 个专栏收录
18 篇文章 1 订阅
订阅专栏
Cesium
9 篇文章 1 订阅
订阅专栏

WebVR

文章目录

1. 前言

WebVR技术可以实现在浏览器端接通VR设备，在VR模式下进行交互。

2. 在线示例

三维模型网站Sketchfab支持在VR模式下预览三维模型：https://sketchfab.com/3d-models/kirkaldys-testing-works-785d4675d66a425db33d98f0d8df587a

image.png

连接VR设备的具体操作可以参考链接：Virtual Reality (VR)

如果没有设备也可以通过模拟器来体验，需要安装浏览器插件：WebXR API Emulator，效果图如下：

image.png

3. 关于开发

通过WebXR Device API可以实现在自己的Web应用中接通VR或AR设备。具体教程可以参考：WebVR开发教程——标准入门

另外可以参考Getting started building a WebXR Website

4. 参考链接

[1] Mixed Reality for the Open Web

[2] WebXR

[3] Sketchfab Sample

[4] Sketchfab WebVR Help

[5] WebVR开发教程——标准入门

[6] WebXR 技术调研 - 在浏览器中构建扩展现实（XR）应用

wml00000
关注
专栏目录
WebXR 技术调研 - 在浏览器中构建扩展现实（XR）应用
字节跳动视频云
08-11 6428
利用 WebXR Device API 可以在 Web 环境访问到 XR 设备，它主要分为 3 种模式inline、和，inline模式还是渲染在浏览器页面中，而则是访问 VR 设备，将画面渲染到 VR 设备中，整体渲染过程与普通 WebGL 程序差不多，只不过画面要渲染到 XRWebGLLayer 的 framebuffer 中，并且区分左右眼。...
WebVR 演示
01-13
Oculus 的WebVR 演示代码， WebVR is a browser API used to interface with VR headsets. Working with WebVR directly requires knowledge of JavaScript and WebGL. Interfacing with a VR headset using WebVR is typically done in two phases: Setup. The application detects the headset, described by the VRDevice object, and targets it for presentation. Per-Frame Rendering. Once setup is complete, a requestAnimationFrame handler is used to query pose data, render the WebGL scene for each eye, and submit it to the headset. Though WebVR is an evolving API, a configuration of the API has crystallized that most major browser vendors believe can reach general availability in 2018. Oculus Browser targets this configuration. All of our samples and documentation explain how to use this version of the API and also where we diverge from it and why.
WebXR：Web上的虚拟与增强现实技术
最新发布
天涯学馆
07-03 1633
什么是WebXR？WebXR API 旨在让浏览器成为VR和AR内容的平台，无需下载额外的应用程序。用户只需访问一个网址，即可通过兼容的设备（如VR头盔、手机或平板电脑）体验沉浸式内容。
Web VR
04-11 626
 转自：http://news.17173.com/content/04102017/144824755_3.shtml 随着用户们对原生VR应用需求的膨胀，他们也一定期待开发者创造出VR的web应用。 首先，VR web体验将带给你类似浏览facebook或youtube的体验。用户在web上，可以将视频切换到「VR模式」。和VR电影不同的是，用户可以在VR环境中来做VR购物、VR约会
WebVR — 网络虚拟现实
ygtu2018的博客
08-30 1220
虚拟现实的概念本身并不新鲜，但现在我们拥有让它正常工作的技术，以及一个JavaScript API可以在Web应用程序中使用它。本文从WebVR在游戏中的使用角度介绍了WebVR。
Web端VR开发初探
一起来捉 Bug 呀~~
01-23 5625
本文为《程序员》原创文章，未经允许不得转载，更多精彩文章请订阅2017年《程序员》 作者：张乾，上海渲图信息科技有限公司CEO。曾任职于腾讯上海研发部，负责次时代游戏引擎的研究与开发工作，目前主要从事VR/AR以及轻量化Web3D的应用与平台开发，热爱图形与渲染。 责编：屠敏，关注 VR/AR 等领域，寻求报道或者投稿请发邮件tumin@csdn.net，另有「CSDN VR 开...
浅谈 WebVR 全景
趣谈前端
10-23 1379
大厂技术坚持周更精选好文前言近年来VR概念越来越火，相信大家在网上都有过VR的浏览体验，比如VR全景看房[1]、VR全景看车[2]、VR全景旅游[3]等等，VR全景给了我们视觉上的沉浸式体验。本文将会简单探究Web VR全景的实现原理，同时也会用threejs实现两个小的demo，希望对大家以后在业务上遇到类似的场景能有所帮助。什么是VR引用维基百科的定义：虚拟现实（英语：virtual ...
WebVR和WebXR技术与Three.js的集成
WebVR（Web Virtual Reality）和WebXR（Web Extended Reality）是一种基于Web技术的虚拟现实（VR）和增强现实（AR）技术，通过浏览器来实现在Web上呈现虚拟现实和增强现实的体验。WebVR主要用于VR设备，而WebXR则...
Cesium与VR技术整合概述 - 概述Cesium与VR技术的整合方式，例如使用Cesium VR扩展、WebVR/WebXR API等。 - 介绍Cesium中与VR相关的功能和特性，例如3D场景渲染、交互操作等。
07-13
Cesium与VR技术的整合可以通过多种方式实现。...总的来说，Cesium与VR技术的整合通过Cesium VR扩展、WebVR/WebXR API等方式实现，提供了3D场景渲染和交互操作等功能，为用户创造了更加沉浸式的虚拟地球体验。
如何在Unity中使用WebXR开发AR/VR应用
albertleebob的博客
05-08 7964
WebXR是一种具有巨大潜力的技术，但是目前，它提供的开发工具比独立VR开发差得多，在独立VR开发中，我们使用Unity和Unreal Engine。Mozilla 为沉浸式Web做了大量工作，为Unity开发一个WebXR导出器使所有Unity开发人员都能使用他们已经熟知的工具创建WebXR体验。该项目可以追溯到2年前，但是最近WebXR插件已得到改进和更新。 以下内容由公众号：AIRX社区（...
webvr-polyfill:立即使用WebVR，无需特殊的浏览器构建
04-12
您也可以在与webvr-polyfill.min.js相同的位置使用缩小的文件。 < script src =' webvr-polyfill.js ' > </ script > <!-- or use a link to a CDN --> < script src =' ...
solipsism-webvr:WebVR对Solipsism的支持
05-01
唯我论webvr 这包增加WebVR互动，您的游戏数据库。 它提供了用于将HMD和位置控制器连接到您的solipsism世界的工具，以及用于非VR设备的故障转移工具，以及一些渲染器和gameloop支持工具。 请注意，尽管它具有一些快捷方式，可以更轻松地与solipsism游戏数据库一起使用，但它也可以与其他游戏世界一起使用。 入门 一个简单的世界 首先，假设您有一个简单的Solipisism设置。 这只是一个没有物理的单人世界。 要添加物理功能和客户端/服务器多人游戏支持，请参阅文档。 var THREE = require ( 'three' ) var Sol = require ( 'solipsism' ) ; var SolVR = require ( 'solipsism-webvr' ) ( THREE ) ; var scene = new THREE . Scen
webxr
03-30
以下是WebXR与CSS结合使用的一些核心知识点： 1. **CSS 3D Transformations**：在WebXR环境中，CSS 3D转换是关键，允许元素在3D空间内移动、旋转和缩放。使用`translate3d()`, `rotate3d()`, 和 `scale3d()`函数...
使用WebVR创建虚拟现实前端体验
sybh的博客
08-02 566
WebVR是一种Web技术，它允许用户通过虚拟现实头显（如Oculus Rift、HTC Vive等）或智能手机配合VR头盔体验虚拟现实。它的目标是在Web浏览器中实现跨平台、无需插件的虚拟现实体验。
动手实践WebVR 全景
Dream_travelerly的博客
01-31 1853
近年来VR概念越来越火，相信大家在网上都有过VR的浏览体验，比如VR全景看房[1]、VR全景看车[2]、VR全景旅游[3]等等，VR全景给了我们视觉上的沉浸式体验。本文将会简单探究Web VR全景的实现原理，同时也会用threejs实现两个小的demo，希望对大家以后在业务上遇到类似的场景能有所帮助。虚拟现实（英语：virtual reality，缩写VR），是利用电脑模拟产生一个三维空间的虚拟世界，提供用户关于视觉等感官的模拟，让用户感觉仿佛身历其境，可以即时、没有限制地观察三维空间内的事物。
Mozilla开发全新的公开网络API WebXR 来实现增强现实
cpongo011702
09-08 185
在添加了Firefox对WebVR的支持之后，Mozilla现在正在开发一款新的API，叫WebXR，来实现网络混合现实的功能。Mozilla去年首次宣布WebXR将会取代WebVR，并将对使用WebVR的开发人员提供平缓的过渡期。\u0026#xD;\u0026#xD;正如Mozilla VR/AR研究工程经理Lars Bergstrom所写的：\u0026#xD;\u0026#xD;\u002...
【WebVR系列文章（1）】WebVR 和浏览器边缘计算革命
前端进阶之路 | 中大厂、外企、国企内推 | 面试培训 | 简历修改
05-30 1217
虚拟现实 (VR) 正在进入各个行业，但尚未成为主流。 WebVR 和边缘计算有可能提高 VR 的采用率并将 VR 带给更广泛的受众。 在本系列文章中，我会向你介绍 WebVR 和边缘计算的基础知识，并附有详细的示例。 虚拟现实（VR）是一个巨大的技术浪潮，它已经到来。 无论你第一次拿着智能手机时的感受如何，第一次体验 VR 时计算机都会在各个方面提供更丰富的情感体验。 作为一个概念，VR 的存在时间比第一部 iphone 的时间更长，但将 VR 带给普通用户所需的技术直到最近才出现。 Oculus .
WebVR简介
yunchao的专栏: HTML5/Chromium/Web, Graphics, Android
03-10 6509
转载请标明出处：http://blog.csdn.net/yunchao_he/article/details/61195801 所谓WebVR，就是VR on Web。它把虚拟现实这项酷炫的技术带到Web领域来，用JavaScrpit来写虚拟现实相关的应用，从而在浏览器或者Web runtime上跨平台运行。
探索WebVR的新世界：WebVR-helloworld
gitblog_00006的博客
03-31 257
探索WebVR的新世界：WebVR-helloworld 项目地址:https://gitcode.com/YoneChen/WebVR-helloworld WebVR-helloworld 是一个初学者友好的项目，旨在引导开发者进入虚拟现实（VR）在Web平台上的应用。这个项目由YoneChen创建，提供了一个基础的框架和示例，帮助我们理解如何利用WebVR API构建沉浸式体验。 项目简介 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值