将three.js模型转换为svg

Question

我正在尝试建立一个工具，允许设计师导入家具部件的3d模型(在3ds max中创建并转换为three.js json)，并通过移动这些部件来组装家具。在他们完成组装后，我需要导出最终的家具模型(几何图形，材料等)作为svg图像显示在我的网站上的2d家居设计师工具。如何将three.js模型(一个或多个)转换为svg。我需要在3d家居设计器工具中做同样的事情，因为用户可以自己重新组装家具，并且svg需要在重新组装完成后动态更新。有没有three.js插件，示例，示例代码或外部javascript库，可以让我在浏览器中将一个或多个three.js模型转换为svg。任何帮助都是非常感谢的。

Answer 1

碰巧，Three.js有THREE.SVGRenderer()。除了可能的小兼容性变化外，你应该能够使用几乎任何Three.js演示，只需用THREE.SVGRenderer替换THREE.WebGLRenderer或THREE.CanvasRenderer即可。

要从渲染器DOM获得结果SVG，请参阅此处：THREE.SVGRenderer save text of image。

显然，结果不会与WebGL或Canvas输出相同，但它将是真正的矢量图形。将更复杂的着色WebGL场景转换为SVG几乎是不可能的，除非您将基于位图的图像数据嵌入其中，这有点违背了SVG和矢量图形的目的。在这种情况下，您最好使用PNG图像，您可以直接从THREE.WebGLRenderer和THREE.CanvasRenderer获取这些图像。

Answer 2

拉吉夫，据我所知，你正在考虑的是俯视、左视、右视、前视等。你应该在three.js中检查一下正交相机来实现这一点。