SketchUp -> 캔버스

Question

저는 우리가 SketchUp에서 구축 한 3D 모델을 웹 페이지에 표시하는 방법을 찾고 있습니다. 나는 three.js를 발견하고 .dae로 내보낼 수 있고 ColladaLoader를 사용하여로드 할 수 있음을 확인했습니다. 불행히도 아직 내 검은 캔버스에 나타나는 모든 것을 얻을 수 없었습니다.

var camera, scene, renderer, my_model; 

    init(); 

    function init() { 
    camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 1, 10000); 
    camera.position.z = 1000; 

    scene = new THREE.Scene(); 

    var loader = new ColladaLoader2(); 
    //var loader = new THREE.ColladaLoader(); 

    loader.load('3d-model.dae', function(result) { 
     my_model = result.scene; 
     scene.add(prequel); 
     animate(); 
    }); 

    renderer = new THREE.WebGLRenderer(); 
    renderer.setSize(window.innerWidth, window.innerHeight); 

    jQuery("#canvas").append(renderer.domElement); 
    //document.body.appendChild(renderer.domElement); 
    } 

    function animate() { 
    requestAnimationFrame(animate); 

    my_model.rotation.x += 0.01; 
    my_model.rotation.y += 0.02; 

    renderer.render(scene, camera); 
    } 

여기에 콘솔에 표시 내용은 다음과 같습니다 (마스터 지점에서 최신 three.js를 사용, 최신 크롬, 최신 OS X의) 여기

은 (http://jsfiddle.net/f17Lz5ux/에서 영감을) 내 코드의 요점이다 three.js를 REPO에서 ColladaLoader를 사용하는 경우 :

https://s3.amazonaws.com/screenshots.equityeats.com/rh1zz.png (dev에 도구 그래서 난/붙여 넣기를 복사 할 수 없습니다 동결)

나는 three.js를 위해 열려있는 문제를 검색하고 https://github.com/rmx/threejs-collada을 찾았지만, 그 eith는 작동하지 않는다. 어. 다음은 콜라다 로더를 사용할 때 콘솔에 표시되는 내용입니다.

ColladaLoader2 WARNING: Skipped element <asset>/<contributor>. Element is legal, but not handled by this loader. 
ColladaLoader.js?body=1:7138 ColladaLoader2 WARNING: Skipped element <asset>/<created>. Element is legal, but not handled by this loader. 
ColladaLoader.js?body=1:7138 ColladaLoader2 WARNING: Skipped element <asset>/<modified>. Element is legal, but not handled by this loader. 
8ColladaLoader.js?body=1:7138 ColladaLoader2 WARNING: Skipped unknown element <library_visual_scenes>/<visual_scene>/<node>/<node>/<node>/<instance_node>. 
76ColladaLoader.js?body=1:7138 ColladaLoader2 WARNING: Skipped unknown element <library_visual_scenes>/<visual_scene>/<node>/<node>/<instance_node>. 
1112ColladaLoader.js?body=1:7138 ColladaLoader2 ERROR: Geometry primitive type lines not supported. 
ColladaLoader.js?body=1:7138 ColladaLoader2 WARNING: Skipped unknown element <library_nodes>. 
ColladaLoader.js?body=1:6103 Uncaught TypeError: undefined is not a function 

모든 도움말/방향을 알려 주시면 감사하겠습니다.

Answer 1

모델을 3D warehouse에 업로드 한 다음 Embed 기능을 사용하여 자신의 웹 페이지에 표시 했습니까?

줌, 팬 및 회전 옵션이있는 썸네일보기와 3D 뷰어을 제공합니다.

Answer 2

나는 3D 이미지 갤러리 솔루션에 동의합니다. 또한 Sketchfab은이를위한 훌륭한 웹 사이트/서비스/도구입니다. SketchUp 모델을 웹 사이트에 업로드하고 장면이되는 주석을 추가 할 수도 있습니다. Sketchfab 3D 모델을 Facebook 게시물에 삽입 할 수도 있습니다!