在HTML5中，按钮单击画布形状更改？

Question

我只想知道是否有任何网站提供有关画布的简要信息。 我正在研究我的项目。其中一个画布和4个按钮。 这是四个按钮：CIRCLE，RECTANGLE，SQUARE和ANIMATED RAINBOW。

在点击矩形按钮的时候点击画布上的圆形按钮动画圆圈在时间圈变成矩形的动画中的容易进出方式。形状更改为另一种形状，但在画布上以动画样式。

我看了很多文章观看很多视频，但我找不到解决方案。 下面我展示了一张图片。

如果有人告诉我并给我一些建议我去哪里学习。 谢谢。

Answer 1

在JavaScript圈，矩形，正方形，彩虹中制作4种不同的功能。 并且在这种情况下制作4个不同的类。 然后根据JavaScript函数中的形状设置convas类的值。 就像你点击圆圈按钮一样。 首先设置HTML代码。

<button id = "circle" onclick ="circle"></button>

当用户点击此按钮时，它将调用圆形函数编写代码，如JavaScript中的圆形函数。

function circle(){
    canvas = document.getElementById("canvas");
    canvas.class = "circle";
    //This is class name which you have to make in case
}