D3.js 在二维房间中模拟光源（点光源）

我试图在2D房间中模拟全向光源。我想建立一个房间，让光线从点光源传播，只有当它到达墙壁时才会停止。结果是阴影将投射到灯光无法到达的位置。下图显示了多个点源的问题

我将在中实现这一点，作为基于的游戏的一部分

我正在努力想出一个适合这种模拟和动画的数据结构。我想象一个圆从源辐射出去，每当它遇到墙时就分裂成弧形？有没有一种方法可以在不模拟大量单个光束的情况下实现这一点？

除了绘制SVG之外，我真的认为d3在这方面没有帮助。在理论方面，元素定义了半径，这意味着它们将在圆周上弯曲。圆弧也会这样做。美术馆的问题涉及多边形空间，而圆可以说不是多边形

在实际方面，如果您打算使用d3，我建议您制作元素。从您的图片来看，似乎每个“灯光”至少覆盖一个房间，并且多边形的点可以与墙的坐标匹配。灯光延伸到其他房间的地方，从虚线上看，大多数情况下都是三角形。在颜色重叠的地方，d3会有所帮助，因为SVG元素可以用alpha组件填充属性

d3.select('svg').append('polygon')
    .attr('fill', 'rgba(255, 0, 0, 0.5)')
    .attr('d', foo);

这将绘制一个半透明红色的多边形

---

然而，d3并不能帮助您计算出这些灯光的坐标。我想你可以用一种搜索算法来做到这一点，该算法从一个“光源”开始，以线性方式发出，检查墙壁。当它找到一堵墙时，它会获取该“停止”点的坐标，并将其添加到多边形的路径中。当多边形绘制时，颜色会重叠，看起来像是光源。

我还应该补充一点，这个问题很有理论性，可能不属于SOThank you的范围。谢谢你的回答，我怀疑这也不是最合适的地方。有更适合SE论坛吗？在一个完美的世界里，某种计算几何SE站点将是最好的，但作为替代，我会猜要么或者也许。你也可以。IMO对于CS/数学教授来说似乎是一个好问题，对于同事来说则是一个挑战。您真的需要SVG输出吗？我觉得在画布上实现这一点要简单得多。对于每个像素，计算出它可以看到哪些光源。也许它不够快，无法实时运行。但你可能不需要这样。或者，如果您需要SVG，您可以将多边形用于墙壁，并为明亮的背景生成一个。D3/SVG根本不是一个要求，它只是基于多边形的动画/等的第一个想法。您提出的逐像素视线模式实际上比我提出的任何东西都要好。谢谢我想，通过从点光源向外旋转来设置环形光传播的动画仍然是可能的，而不是穿过像素行？假设你的画廊有如示例所示的墙，那么每个像素仅36次调用4个灯光x 9个矩形墙。