计算随机放置在定义区域中的图像的可用空间的最佳方法

时间:2012-10-22 14:39:59

标签: javascript html canvas

我正在使用HTML的Canvas标签来创建随机生成的文字云。我正在寻找最好的(也是最有效的)方法来计算在一个定义的区域中有足够的空格来容纳一个单词的位置。我现在能想到的唯一方法是拥有一个存储可用空间块的空闲列表,并在页面上放置新图像时进行调整。

我在这里有一个示例生成器:http://pathrazor.com/wordcloud/。但是,这个例子还没有随机旋转单词,这会增加我所要求的复杂性。如果碰撞检测不是自由空间问题解决方案的一部分,将在以后添加碰撞检测。

有没有人有任何有趣的想法或以前做过这个?任何输入都会很棒。

1 个答案:

答案 0 :(得分:1)

我建议使用这样的算法:

  • 假设你有一个空格的矩形。
  • 将一个单词随机(或伪随机,或者您喜欢)放入该矩形。
  • 想象一下,这个词被包裹在自己的小矩形中。扩展该矩形的直线,直到它们到达较大容器的边界。
  • 您剩余的可用空间现在分为四个重叠的矩形:在单词的正面和背面有两个垂直的矩形,在它上面和下面有两个水平的矩形。
  • 将这些矩形存储在内存中。
  • 您放置的下一个单词将与这些矩形中的一个或两个重叠。如果是这样,将它们进一步分开并重复该过程。

您可能还会发现this question over at SE's game development site有用。