React VR isn't limited to simple 3D primitives. By using the <Model/> Component we can place a complex 3D models into our scene.

import React from 'react';
import {
AppRegistry,
asset,
Pano,
Text,
View,
Image,
Model,
Sphere,
PointLight,
AmbientLight,
DirectionalLight,
} from 'react-vr'; export default class app extends React.Component {
render() {
return (
<View>
<DirectionalLight
intensity={5}
style={{
transform: [{translateZ: -1}]
}}
/>
<Model
source={{
obj: asset('girl.obj')
}}
style={{
color: 'white',
transform: [{translate: [0, -10, -30]}]
}}
lit
/>
</View>
);
}
}; AppRegistry.registerComponent('app', () => app);

[ReactVR] Render Custom 3D Objects Using the Model Component in React VR的更多相关文章

  1. [ReactVR] Animate Text, Images, Views, and 3D Elements Using the Animated Library in React VR

    Motion is an important aspect of a complete immersive experience, therefor we are going to look into ...

  2. [ReactVR] Add Shapes Using 3D Primitives in React VR

    React VR ships with a handful of 3D primitives. We'll importprimitives like <Sphere/>, <Box ...

  3. #学习笔记# VALSE 2019.01.09 朱俊彦 --- Learning to Synthesize Images, Videos, and 3D Objects

    视频类型:VALSE-webinar 报告时间:2019年01月09日 报告人:MIT朱俊彦 报告题目:Learning to Synthesize Images, Videos, and 3D Ob ...

  4. [ReactVR] Add Lighting Using Light Components in React VR

    In order to illuminate a scene containing 3D objects a lighting setup is required. In this lesson we ...

  5. [ReactVR] Start a Virtual Reality Project Using the React VR CLI

    We will learn how to set up a React VR project, run the development mode with hot reloading, and tak ...

  6. React报错之Objects are not valid as a React child

    正文从这开始~ 总览 当我们尝试在JSX代码中,直接渲染对象或者数组时,会产生"Objects are not valid as a React child"错误.为了解决该错误, ...

  7. AngularJs学习笔记--Understanding the Model Component

    原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model 在angular文档讨论的上下文中,术语“model”可以 ...

  8. 3D objects key rendering steps

    Key steps of Rendering objects: 1 Create objects’ meshes, which we can use C++’s vector container to ...

  9. render函数data参数中的model选项

    官方文档没有说, 但是编译v-model时, 是有model这个选项的, 例如: _c('el-input', { attrs: { "placeholder": "手机 ...

随机推荐

  1. NEFU 84

    其实同POJ 1061 #include <iostream> #include <cstdio> #include <cstring> #include < ...

  2. 转:IOS远程推送通知

    在ios系统中,app应用程序无法在后台完成较多的任务,仅仅允许程序做一些有限的任务(如音视频播放.地理位置信息.voip).然而,如果你想做 一些有趣的事情,并且告知用户,甚至用户没有使用你的app ...

  3. 谷歌浏览器 —— 快捷键(vimium:像使用 vim 一样操作当前页面)

    Chrome 键盘快捷键 拷贝当前页面内的某链接: 首先输入 y(进入 yank 模式),输入 f,为当前页面内的全部超链接编号,然后输入待拷贝的链接编号,即可将该链接复制到粘贴板: 1. 使用 vi ...

  4. windows下安装ImageMagick扩展

    最近项目中需要用到图片的一些特殊处理——比如:根据用户请求生成任意尺寸的图像.经过一些资料的查找,最终选用了php_imagick.利用 ImageMagick,你可以根据web应用程序的需要动态生成 ...

  5. vscode 插件推荐 - 献给所有前端工程师

    VScode现在已经越来越完善.性能远超Atom和webstorm,你有什么理由不用它?在这里,我会给你们推荐很多实用的插件,让你对 vscode 有更深刻的体会,渐渐地你就会知道它有多好用. 走马观 ...

  6. 手机、电脑、安卓、iOS、微信浏览器判断

    微信浏览器判断: // true为微信浏览器function is_weixin() { var ua = window.navigator.userAgent.toLowerCase(); if ( ...

  7. Codeforces 994A. Fingerprints

    题意 从x数组中找到最多的y数组中有的数字,按在x数组中出现的顺序输出. 注意 这题x数组和y数组都不会出现重复数字. 代码 #include <bits/stdc++.h> using ...

  8. 洛谷P1816 忠诚 分块

    分块真的是很暴力呀… 暴力查询左端,暴力查询又端点,中间整体部分直接 $O(1)$ 求出. 注意编程细节:belong[i]=(i−1)/block+1,这样可以保证序列被分成这样的: Code: # ...

  9. Codeforces Round #470 (rated, Div. 2, based on VK Cup 2018 Round 1)B. Primal Sport

    Alice and Bob begin their day with a quick game. They first choose a starting number X0 ≥ 3 and try ...

  10. js原生api之String的slice方法

    我们在工作中可能会很少进行这样的思考,对于一些常用的原生api它是如何实现的呢,如果让我们去用js实现一个与原生api功能相同的函数我们该如何设计算法去实现呢? 为了巩固自己的编程技术和提高自己的编程 ...