다음은 Three.js의 R76 및 R77에서 svg 파일로 잘 작동하지만, R78에서는 png 및 jpg로만 작동합니다.three.js : textureloader가 r78 이후로 작동하지 않는 svg입니다.
문제가 발생하기 때문에var floor = new THREE.TextureLoader();
floor.load('layout.svg', function (texture) {
var geometry = new THREE.PlaneBufferGeometry(4096, 4096);
var material = new THREE.MeshBasicMaterial({ map: texture });
var mesh = new THREE.Mesh(geometry, material);
mesh.rotation.x = -Math.PI/2;
scene.add(mesh);
});
, 나는 ... 부하 인수에 R78에서 SVG 100 %로드는 것을 알려줍니다
function (xhr) {
console.log((xhr.loaded/xhr.total * 100) + '% loaded');
},
function (xhr) {
console.log('An error happened');
}
을 ... 진행 및 오류 기능을 추가하지만, 장면에 나타나지 않습니다. 나는 이것을 반사 속성을 위해 phongmaterial과 함께 사용했고, 투명도로 svg 요소가 skymap에 떠 다니는 것을 보였습니다. 재미 있습니다. 제 질문은 어떻게 작동합니까?
R77에서 svg는 FF 또는 chrome의 planeBufferGeometry에 매핑됩니다.
R78에서는로드하지 않고 Firebug에 오류가 표시되지 않습니다.
UPDATE는 I (또한 Projector.js 필요) SVGLoader.js, SVGRenderer.js을 조사 하였다. 카메라에 직면 한 svg 파일을 렌더링하고 번역에는 응답하지만 회전에는 응답하지 않습니다. 즉 투시도가 가능하지 않습니다. svg 파일에 xml 헤더를 추가 한 다음 doctype을 추가했지만 threejs는 분명히 부재로 인해 방해받지 않았습니다. localhost를 사용하면 Chrome에서 FF가 필요하지 않습니다.
문제는 TextureLoader 또는 WebGLRenderer에서 찾을 수 있습니다. 둘 다 R78에 상당히 개편되어 있습니다.
또한 r78처럼 작동하는 dev 버전도 간략하게 사용해 보았습니다.
내가 어디에서 왔는지 제안 할 수있는 사람이 있습니까? 나는 버그를 제출할 지 모르겠다. Here's 원하는 효과.