Javascript 如何在node.js中呈现三个.js？

如何在node.js中呈现three.js代码

---

我想从blender导出，然后通过

fs

打开导出，并用它渲染场景。

这是一个有点难闻的实现，但要记住的关键部分是创建几何体的部分，其他一切都很简单。我把它放在这里主要是为了以后我自己的参考，但它确实可以工作，而且在nodejs中进行三维渲染也很酷。哦，是的，它也需要画布来工作

它依赖于

three.js

npm模块

如果出现错误

无法找到./lib/Three

：

---

我提到的

three.js

模块可能在内部指向three的旧版本。我记得我必须进入模块并编辑一个文件，将其

require（'./lib/Three'）

编辑为

require（'./lib/Three'）

。我猜他在package.json中包含了一个非特定的3，所以它在没有更新npm模块的情况下得到了更新。。现在可能已经修复了

你不应该在服务器上运行可视化代码，如果你在服务器上做计算成本很高的事情，你需要准备好投入大量的精力。您需要的是将导出和呈现委派给客户端计算机。

我看不出您为什么不能使用类似的工具，它允许您创建桌面应用程序并在其中实现node.js。这不是对这个问题的确切答案，但为了让人们寻找类似的答案，我将发布这个答案，直到：Three.js可以在node.js上运行。事实上，从r61起Three.js不再有任何对

窗口的引用，因此在node.js中可用。很好的代码@Funkodebat将缓冲区渲染到图像并将其传回。在线性能如何？引用的库使用jsdom破解了一个假窗口，并在其中打开了三个窗口，同时改变了它需要做的事情。因为某种原因，很难找到，我留下了一个link@Darryl_Lehmann我没有注意到任何缓慢。这是退路的退路。它应该在客户端浏览器中运行webgl。如果失败，它将转到应用服务器，并通过socket.io将应用服务器连接到现场GPU ubuntu盒，打开一个浏览器窗口，呈现webgl并将其传递回服务器，返回给客户。如果我们的GPUbuntuBox关闭了，那么这段代码将运行并渲染图像，因为它只能绘制画布，看起来并不漂亮，但拥有它仍然很酷：）另一个注意，我记得在提到的模块中必须编辑require（'lib/Three'）到require（'lib/Three'）。我认为他的package.json可能非常不具体。你应该得到一个错误，说图书馆找不到三个，但如果你看，三个是存在的。首先，这不是OP要求的。第二，node.js不仅仅适用于服务器。^我是node.js的stanch捍卫者，我经常说，为网页提供服务是node最不有趣的功能。是的，让我们否决任何考虑提供优化建议的人。这取决于要求是什么。比如说，如果我想批量渲染或合成图像以便在社交媒体上共享，或者打印就绪的艺术品，那么就没有支持Javascript的客户端，因此无头渲染是非常可取的。假设某个特定场景的“不应该”建议可能令人难以置信地讨厌。相反，也许最好让OP从怀疑中受益，并建议他们在合适的情况下可以尝试不同的方式。Node-webkit就像一个解锁的浏览器。。它仍然在计算机上运行，而不是在服务器上运行。我已经完成了一些方法，其中一个虚拟机运行（带有视频卡），在虚拟机的浏览器中呈现3J，然后向服务器发送一个屏幕截图，然后发送给请求它的人。今天我会使用浏览器或nw。我想您可以将服务器合并到呈现的NW实例中，但无论如何，您仍然需要一个有头的服务器。另外，4年前当这个问题被问到时，NW还不存在。
fs = require("fs")

THREE = require("three.js")
join = require("path").join

app.get '/test/top_:top_id/side_:side_id/x_:x/y_:y.jpg', (req, res, next) =>

  width = 660
  height = 500

  camera = new THREE.PerspectiveCamera(50, width / height, 1, 1000)
  scene = new THREE.Scene()
  renderer = new THREE.CanvasRenderer( )
  renderer.setSize width, height

  camera.position.z = 100

  camera_container = new THREE.Object3D
  scene.add camera_container
  camera_container.add camera

  camera.position.z = 75

  # We have one background plane
  plane_image = new Image
  plane_image.src = fs.readFileSync TOP_DIR + "public/images/vtx_logo.jpg"
  texture = new THREE.Texture plane_image, new THREE.UVMapping()
  texture.needsUpdate = true

  loader = new THREE.JSONLoader()

  geometry = new THREE.PlaneGeometry(200, 200)
  material = new THREE.MeshBasicMaterial
    color       : 0x698144
    #shading        : THREE.SmoothShading
    map     : texture
    overdraw: true
  plane = new THREE.Mesh geometry, material
  plane.position.z = -50
  plane.position.y = -4
  plane.position.x = 4.5

  # We also have an object in the foreground
  scene.add plane
  geometry = false
  loader.createModel JSON.parse(fs.readFileSync(TOP_DIR + 'public/blender_export.json')), (done) =>
    geometry = done

  # Imager.texture gives us a canvas based on some code that grabs specific info
  texture = new THREE.Texture (Imager.texture req.params.side_id, req.params.top_id), new THREE.UVMapping()
  texture.needsUpdate = true

  material = new THREE.MeshBasicMaterial
    color: 0xaaaaaa
    map: texture
    overdraw: true
  mesh = new THREE.Mesh geometry, material

  mesh.rotation.x = parseFloat req.params.x
  mesh.rotation.y = parseFloat req.params.y

  scene.add mesh
  mesh.dynamic = true
  renderer.render scene, camera

  renderer.domElement.toBuffer (err, buf) ->
    res.contentType 'image/jpg'
    res.send buf