我正在尝试创建一个大于画布大小的图。那么我是否可以创建绘图并在画布查看区域中仅显示其中的一部分。
要查看剩余的绘图，应该有一个滚动条，将绘图带入查看区域。
也欢迎提示。
答案 0 :(得分：1)
当然，您可以使用两种基本方式：
将所有内容绘制到画布上，即使它的一部分在可见区域之外并使用平移来平移
收集完全或部分可见的线条/形状，仅显示这些线条/形状。检查时使用内部翻译添加到点。
第一种方法很简单，有效。如果你有很多积分，那就不是最有效的。它不会受到剪裁图形的画布的影响，但即使对于不可见的部分，您也需要执行所有JavaScript代码。
通过翻译画布然后（清除和）重绘来“平移”点。 Canvas会为你做所有必要的剪裁（如果你的点会产生非常大的，你可以对这些点进行粗略剪裁，例如看四叉树）。
第二种方法更有效，因为它减少了绘制操作，但增加了查找需要绘制的形状的成本。但它也可能更复杂，具体取决于您使用的是哪种形状，例如，即使一个端点在外面，线也需要继续正确的方向，因此您的算法也需要考虑这些情况。
如果您没有大量的条目，那么我将从第一个开始，如果需要则进展到2.如果您做拥有“数十亿”的条目，那么您将需要一个更复杂的缓冲系统，这个系统将超出此答案的范围。
您可以使用鼠标/触摸拖动来代替滚动条（或除了一个滚动条）。 Canvas不支持其（位图）内容的滚动条，因此您必须自己创建一个（我不建议使用巨型画布并在div内滚动，因为这会产生巨大的内存影响并且会影响移动设备的性能等。）