雪の結晶作りコッホ雪片を表示します。画面をタップする度に、頂点の数が増加します。コッホ雪片の色は水色です。's game

Click here for free DL of the app version that can save data.

No:4871

4440

←

Prev Next

→

雪の結晶作りコッホ雪片を表示します。画面をタップする度に、頂点の数が増加します。コッ..ALL
Developer anonymous｜Date and time 70/1/1 9:32:45
Build time unknown sec｜Game capacity 1.965KB｜

Script

以下が、JavaScriptを含んだHTMLファイルとしてのコッホ雪片のゲーム実装です。

この実装では、HTMLファイル内に`canvas`要素を用意し、その中にコッホ雪片を描画しています。`canvas`要素をクリックする度に、頂点の数が増加し、コッホ雪片の形状が変化します。コッホ雪片の色は水色です。また、スマホで操作することを前提として、クリックイベントを実装しています。

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

Click here for free DL of the app version that can save data.

以下が、JavaScriptを含んだHTMLファイルとしてのコッホ雪片のゲーム実装です。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>コッホ雪片</title>
    <style>
        #canvas {
            background-color: white;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <canvas id="canvas" width="600" height="600"></canvas>

let numVertices = 3;

canvas.addEventListener("click", addVertex);

function addVertex() {
            numVertices += 1;
            drawKochSnowflake();
        }

function drawKochSnowflake() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

const centerX = canvas.width / 2;
            const centerY = canvas.height / 2;
            const radius = Math.min(centerX, centerY) - 50;

ctx.beginPath();
            ctx.moveTo(centerX + radius * Math.cos(0), centerY + radius * Math.sin(0));

for (let i = 1; i <= numVertices; i++) {
                const angle = (i * Math.PI * 2) / numVertices;
                const x = centerX + radius * Math.cos(angle);
                const y = centerY + radius * Math.sin(angle);
                ctx.lineTo(x, y);
            }

ctx.closePath();
            ctx.strokeStyle = "lightblue";
            ctx.lineWidth = 3;
            ctx.stroke();
        }

drawKochSnowflake();
    </script>
</body>
</html>
```