Javascript 在初始加载后将滚动条添加到画布

我正在使用画布，只需要在必要时添加滚动条。当页面加载时，没有足够的内容需要滚动条。我正在创建一个二进制搜索树可视化工具，用户可以在其中插入节点。每次插入节点对象时，它都会向下移动到下一个级别，最终导致节点被放置在屏幕之外。我想有一个滚动条，一旦有人试图把一个节点离开屏幕。我尝试了以下方法，但没有任何运气

function setup () { 
    var canvas = createCanvas(windowWidth - 100, windowHeight - 350);
}

canvas {
    border: 1px solid black;
    margin-left: 40px;
    overflow: auto;
}

我读过关于使用“自动”的文章，我的理解是，如果确定内容超出特定空间，它允许滚动。也就是说，我不确定我是否误解了这个属性，或者我是否错误地使用了它

还值得一提的是，我正在使用p5.js库进行可视化。这是通过在访问页面后调用“setup”来实现的。我在项目的其他地方使用过“overflow:auto”，只要内容最初超出了空间，就没有问题。这让我觉得我的第一个想法是我的问题。如果是这样，我将如何实现我的目标

最初的想法：

setup（）只调用一次，这就是为什么在内容开始时超出创建的空间时溢出会起作用的原因

我误解了如何处理溢出，应该使用“自动”以外的方法来处理这个特殊情况

---

只要滚动条小于窗口，它就不会出现在p5画布上。您可以使用调整画布的大小。

您可以发布一个新的吗？我没有看到任何代码在创建画布后增加画布的大小？此外，文章中的代码混合了JavaScript和CSS。它们在两个不同的文件中吗？如果是的话，你能让这一点更加明显吗？最后，我想尝试几件事：在CSS中为画布指定一个高度，或者使用

parent（）

函数并在CSS中为父元素指定一个高度？唯一可行的方法是调整画布的大小，使其超出屏幕？如果是这样的话，我想我得换一种方式来做。