SketchUp ->画布

Question

我已经搜索了一段时间，寻找如何获得我们在SketchUp中构建的3d模型，以便在网页上显示。我找到了three.js，并看到我可以将它导出到.dae中，并使用ColladaLoader加载它。不幸的是，我还没能在我的黑色画布上找到任何东西。(使用主分支最新的three.js、最新的Chrome、最新的OS )

下面是我的代码要点(受http://jsfiddle.net/f17Lz5ux/启发)：

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

下面是在控制台中使用来自ColladaLoader回购的three.js时所显示的内容：

https://s3.amazonaws.com/screenshots.equityeats.com/rh1zz.png (开发工具冻结，所以我无法复制/粘贴)

我搜索了three.js的开放问题并找到了https://github.com/rmx/threejs-collada，但这也不起作用。下面是使用collada加载程序时控制台中显示的内容：

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查看器。

​

​

Answer 2

我同意3D仓库解决方案。另外，Sketchfab是一个很好的网站/服务/工具。你可以把你的SketchUp模型上传到他们的网站上，甚至添加注释，这样就成了场景。你也可以将Sketchfab 3D模型嵌入到Facebook帖子中！