2016-08-23 12 views
2

React에서 Aframe 엔터티 구성 요소에 이미지를 추가하려고합니다. React에서 aframe 엔터티에 이미지 추가

<Entity geometry="primitive: plane; width: 30; height: 30" 
       material={{src: "url(assets/image2.jpg)"}} 
       position="0 -2 0" 
       rotation="-90 0 0"> 
</Entity> 

그러나, 이미지가 표시되지 않은 : 여기에 내가 평면 기하학의 재료로 이미지를 추가 해요 방법입니다. 이미지는 원시 html로 제대로로드되지만 React와 JSX에서는 작동하지 않습니다.

나는 콘솔에서 다음과 오류를 받고 있어요 :

구성 요소 : 질감 : $s 경고하지 않은 유효한 비디오 + 1 개 초 자산 /에서는 image2.jpg

[.Offscreen를 위해 WebGL이 0x7fb65d129a00 ] 렌더 경고 : 텍스처 유닛 0에 바인딩 된 텍스처는 렌더링 할 수 없습니다. 어쩌면 2의 비 (non-power-of-2) 일 수도 있고 호환되지 않는 텍스처 필터링을 가지고있을 수도 있습니다.

+0

흠, 내가 볼 수있는 유일한 것은 이미지를로드하지 못한 것입니다. 경로와 개발자 서버를 다시 확인 하시겠습니까? – ngokevin

+0

재료 속성의 src에 동적 값을 전달하려면 어떻게해야합니까?이 소재는 {{src : 'url ('+ {this.state.imageUrl} + ')' '}} 시도했지만' this '는 예약어입니다. @ngokevin – Aayushi

답변

0

let material = { 
      shader: 'flat', 
      src : './imagepath.jpg' 
     }; 

등) (
그것의 렌더링 선언한다 수 있습니다 방법을 재료 속성 값을 전달하는 올바른 방법 다음 엔터티 구성 요소에서 모든 만약이

<Entity geometry={{primitive: 'sphere', radius: 5000}} material={material} /> 

처럼 통과 이미지가 표시되지 않는 경우에도 다음을 모두 가져 오십시오. -

import React from 'react'; 
import 'aframe'; 
import 'babel-polyfill'; 
import {Entity} from 'aframe-react'; 
관련 문제