2017-03-08 19 views
9

'da bu malzemenin bir özelliği değildir React VR ile bir uygulama geliştiriyorum ve blender ile bir 3D pokeball yarattım. Bunu Wavefront .obj dosyası olarak dışa aktarıyorum ve bunu React VR uygulamasında kullanıyorum.shininess, emissive ve specular React VR

THREE.MeshBasicMaterial:: Konsolda

bu uyarısı gösterilen shininess, emissive ve specular Bu malzemenin bir özellik değildir.

sen benim kodunu bulabiliriz Aşağıda:

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); 

Bu render çıkış

Ve this GitHub Gist üzerine sen obj ve mtl dosyayı bulabildiğim ve indirmek olabilir olduğunu blend dosya.

Burada Blender'deki pokeball'umu görebilirsiniz. Internette arama yapmış ancak ilgili sorun hakkında çözüm veya dokümanları bulundu vermedi

VR yanıt verin.

Neyi yanlış yaptım?

cevap

6

Bu, Github issue gibi react-vr > 0.2.1 gibi bir sorun olmamalıdır. Ayrıca, modelinizin renk ve gölgelendirme ile render edilmesini isterseniz, sahneye bazı ışıklar uygulamanız gerekir. Bu, modelinizde lit desteğini etkinleştirerek ve sahnedeki AmbientLight, SpotLight veya DirectionalLight bileşenlerini kullanarak yapılır.

bunu nasıl yapılır görmek için ModelSample kontrol edebilirsiniz eğirme animasyon için

3d model in vr

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); 
.