在React VR中,光泽,发光和镜面反射不属于此材质

Question

我正在使用React VR开发一个应用程序,我用搅拌器创建了一个3D pokeball.我将其导出为Wavefront .obj文件并在我的React VR应用程序中使用它.

在控制台中我看到了这个警告:

THREE.MeshBasicMaterial:shininess,emissive并且specular不是这种材料的财产.

您可以在下面找到我的代码:

import React from 'react';
import { AppRegistry, asset, StyleSheet, Pano, Text, View, Mesh } from 'react-vr';

class pokemongo extends React.Component {
  render() {
    return (
      <View>
        <Pano source={asset('sky.jpg')} />
        <Mesh source={{ mesh: asset('pokeball.obj'), mtl: asset('pokeball.mtl') }} 
              style={{ height: 1 }} 
              transform={{ rotate: '0 90 0' }}></Mesh>
      </View>
    );
  }
};

AppRegistry.registerComponent('pokemongo', () => pokemongo);

这是渲染输出

在这个GitHub Gist上你可以找到obj和mtl文件,你可以下载该blend文件.

在这里你可以在Blender看到我的pokeball.

我在互联网上搜索过,但没有找到与React VR相关的问题的解决方案或文档.

我做错了什么？

Answer 1

这不应该react-vr > 0.2.1像Github问题状态那样成为一个问题.

此外,如果您希望模型使用颜色和阴影渲染,则需要将一些灯光应用到场景中.这是通过使该做lit的模型道具,并使用两种AmbientLight,SpotLight或DirectionalLight在场景中的组件.

import React from "react";
import {
  AppRegistry,
  asset,
  Pano,
  View,
  Model,
  AmbientLight,
  SpotLight
} from "react-vr";

class pokemongo extends React.Component {
  render() {
    return (
      <View>
        <Pano source={asset("chess-world.jpg")} />
        <AmbientLight intensity={0.5} />
        <SpotLight
          intensity={1}
          style={{ transform: [{ translate: [-5, 5, 0] }] }}
        />
        <Model
          source={{
            obj: asset("pokeball.obj"),
            mtl: asset("pokeball.mtl")
          }}
          style={{
            layoutOrigin: [0.5, 0.5],
            transform: [
              { translate: [0, 0, -10] }
            ]
          }}
          lit={true}
        />
      </View>
    );
  }
}

AppRegistry.registerComponent("pokemongo", () => pokemongo);

对于旋转动画,您可以查看ModelSample以查看它是如何制作的.