teratail 374584

https://teratail.com/questions/374584

by cx20

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>

JavaScript

//バニラ、イチゴ、ラムネ、抹茶、メロン、オレンジ、チョコ
let colors = ["#FEFAE0", "#FFC8DD", "#9BF6FF", "#2D6A4F", "#CAFFBF", "#FFB700", "#99582A"];
let names = ["バニラ", "イチゴ", "ラムネ", "抹茶", "メロン", "オレンジ", "チョコ"];

console.log(names.length);
function setup() {
    frameRate(10);
    createCanvas(windowWidth, windowHeight);
    noStroke();
}

function draw() {
    background(229, 171, 229);

		const x = width / 2;
    const y = height / 2;

    // アイスの色を決定する(0~6を選択)
    const c = int(random(colors.length));

    // 先ほど決定したアイスの色を塗りつぶしに使用する色として指定
    fill(colors[c]);
    noStroke();
    ellipse(x, y, 200);

    fill(102, 0, 0);
    triangle(x - 100, y + 40, x + 100, y + 40, x, y + 290);

    //cone texture
    stroke(204, 102, 51);
    strokeWeight(4);
    line(x - 100 + 15, y + 40 + 30, x + 100 - 15, y + 40 + 30);
    line(x - 100 + 24, y + 40 + 60, x + 100 - 24, y + 40 + 60);
    line(x - 100 + 38, y + 40 + 90, x + 100 - 38, y + 40 + 90);
    line(x - 100 + 50, y + 40 + 120, x + 100 - 50, y + 40 + 120);
    line(x - 100 + 62, y + 40 + 150, x + 100 - 62, y + 40 + 150);
    line(x - 100 + 75, y + 40 + 180, x + 100 - 75, y + 40 + 180);
    line(x - 100 + 85, y + 40 + 210, x + 100 - 85, y + 40 + 210);
    line(x, y + 40, x, y + 280);
    line(x - 40, y + 40, x - 40, y + 190);
    line(x + 40, y + 40, x + 40, y + 190);
    line(x - 80, y + 40, x - 80, y + 90);
    line(x + 80, y + 40, x + 80, y + 90);

    //instructions
    fill(255, 255, 255);
    textAlign(CENTER, TOP);
    textSize(30);
    noStroke();
    text("アイスクリームの味何にする?", 270, 80);

    // 文字色を指定
    stroke(204, 102, 51);
    // アイスの色名を表示
    text(names[c], 270, 130);
}

function mouseClicked() {
    if (isLooping()) {
        noLoop();
    } else {
        loop();
    }
}