Web浏览器中的模拟

Simulation in a Web Browser

本文关键字：模拟 浏览器 Web      更新时间：2023-09-26

很抱歉，如果标题令人困惑，很难用一个短语来概括。

我正在做一个项目，包括在网络浏览器中渲染机器人模拟。更具体地说，在我学习的大学里，他们使用C++编写的模拟器，这个程序模拟机器人在环境中进化。该模拟器有许多可用的输出，如3D OpenGL可视化等。一个可用的输出是基本的文本渲染，它为每个时间步长输出，每个机器人在环境中的位置。

好的，所以他们让我在浏览器中进行一种新型的可视化。这意味着可以上传模拟器的代码，在服务器上启动它，并在浏览器中查看模拟（在HTML5画布或SVG中），同时在服务器上进行模拟！

好吧，所以我第一次想到使用Ajax从模拟器中获取数据，并使用一些Canvas Library在屏幕上绘制机器人。但他们不想需要Web服务器，所以我想直接在模拟器中编写一种新型的可视化（如果确实存在的话，使用C++WebSocket库），它将充当WebSocket服务器，这样浏览器就可以直接与模拟器对话，而无需Web服务器（不知道是否可能）。

嗯。。。这就是想法。如果你能告诉我你对它的看法，并给我一些建议/链接，那就太棒了。是否可以在没有Web服务器的情况下处理此问题？如果不在模拟器中实现HTTP协议是不可能的，那么我将跳过这个想法，使用Web服务器：）

第二个问题更准确：我已经看过一些HTML5 Canvas库，fabric.js，jCanvaScript，dojo.gfx，cake，doodle.js，bHive，KineticJS。我仍然不确定该用哪一个。我开始用jCanvaScript做一些实验，但我遇到了一个问题。我从服务器获取数据（机器人在每个时间步长的位置），然后必须在画布中绘制它们。我使用了一些.animate函数来获得平滑的运动。这个函数需要几毫秒，即动画的时间，我不知道如何同步我必须在模拟的每个时间步长移动的所有对象的动画。你知道一个有助于实现这种模拟的框架吗？（只是在每个时间步长之间移动对象）。

就这样，为我糟糕的英语道歉，我希望这是可以理解的，如果不能，告诉我，我会重新措辞。

提前感谢您的帮助。我有点迷失在这个项目上，任何建议都将不胜感激！

祝你今天过得愉快。

巴尔扎德。

如果您可以访问模拟源，并希望直接在其中构建WebSocket服务器组件，我已经编写了一个独立的C++WebSocket库（WebSocket++，https://github.com/zaphoyd/websocketpp/，BSD许可）来做这类事情。WebSocket++提供了通过自包含的WebSocket服务器公开C++应用程序输出所需的所有组件。另一方面，如果您只需要通过WebSocket node.js/ssocket.io或Autobahn WebSocket库（python）公开stdout，则设置起来可能更简单。

到目前为止，我已经使用WebSocket++将实时数据从C++虚拟世界服务器推送到浏览器，以便通过画布进行渲染，并且目前正在开发一个C++热扩散模拟器，该模拟器将在一个配套的javascript应用程序中显示模拟的实时可视化。如果你正在考虑全C++路线，请随时在GitHub上ping我。

1）如果您想从互联网访问任何外部数据，就无法避免运行服务器。

我假设您将运行simulator.exe并以文本模式捕获其输出。

如果该模拟器是windows应用程序，我建议使用C++

如果是linux，我会尝试node.js

你预计每秒更新多少次

< 5使用AJAX

> 5用于WebSockets

2） Canvas API本身使用起来非常简单，所以您可能不需要任何库来处理它

关于动画的注释-只是在时间上在新旧数据之间插值-我的意思是：

PSEUDO CODE:
duration = 20; // it's equal to synchronising interval
onDataReceived(data) {
  // get the step width needed to achieve `new x` in `duration`
  robot.stepX = abs(robot.x - data.x) / duration;
  robot.newX = data.x;
}
timerLoop {
  if(robot.x < robot.newX) robot.x += robot.stepX;
  // ...
}

如果你决定用节点来做这件事，这可能会帮助你用node.JS构建的多人JavaScript游戏-分离玩家

相关文章：