亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

每秒隨機從數組中選擇一個新數字

每秒隨機從數組中選擇一個新數字

慕尼黑8549860 2022-10-13 10:48:33
var canvas = document.createElement("canvas");        b = canvas.getContext("2d");        canvas.id = "canvas"                canvas.width = 900;        canvas.height = 600;                document.body.appendChild(canvas);                                var posX =  430;        posY = 300;                var myArray = [-3.5,0,3.5];                var dX = myArray[Math.floor(Math.random()*myArray.length)];        var dY = myArray[Math.floor(Math.random()*myArray.length)];                             setInterval(function (){                b.fillStyle = "steelblue";                b.fillRect(0, 0, canvas.width, canvas.height);                posX += dX;                posY += dY;                            if (posX > 875){                    dX = 0;                    posX = 875;                }                if (posX < 5){                    dx = 0;                    posX = 5;                }                if (posY > 575){                        dY = 0;                        posY = 575;                }                if (posY < 5){                        dY = 0;                        posY = 5;                }                b.fillStyle = "snow";        b.fillRect(posX, posY, 20, 20);        }, 20)這就是我的全部代碼。我想隨機移動背景上的立方體。現在它只向一個隨機方向移動。但我希望它每秒都改變這個方向。因為 dX 和 dY 必須每秒改變一次。
查看完整描述

4 回答

?
慕的地10843

TA貢獻1785條經驗 獲得超8個贊

這樣做:如果您對代碼有任何疑問。隨意寫評論。


const canvas = document.createElement('canvas')

canvas.width = 100

canvas.height = 100

canvas.style.backgroundColor = 'steelblue'

document.body.appendChild(canvas)

const ctx = canvas.getContext('2d')


const RADIUS = 5

const SPEED = 0.6

let pos = [canvas.width / 2, canvas.height / 2]

let direction = [0, 0]


setInterval(function() {

    pos[0] += direction[0] * SPEED

    pos[1] += direction[1] * SPEED


    if(pos[0] <= RADIUS || pos[0] >= canvas.width - RADIUS ||

    pos[1] <= RADIUS || pos[1] >= canvas.height - RADIUS) {

        pos = [canvas.width / 2, canvas.height / 2] 

    }


    ctx.clearRect(0, 0, canvas.width, canvas.height)

    ctx.fillStyle = "snow"

    ctx.fillRect(pos[0] - RADIUS, pos[1] - RADIUS, 2 * RADIUS, 2 * RADIUS)

}, 20)


setInterval(function() {

    const randomAngle = Math.random() * 2 * Math.PI

    direction = [Math.cos(randomAngle), Math.sin(randomAngle)]

}, 1000)


查看完整回答
反對 回復 2022-10-13
?
守著一只汪

TA貢獻1872條經驗 獲得超4個贊

我個人會選擇使用Array.prototype添加一個方法來獲取數組的隨機元素,然后使用setInterval每秒更新值:


Array.prototype.getRandom = function() {

  let index = Math.floor(Math.random() * this.length);

  return this[index];

}


var myArray = [-3.5,0,3.5];

var dX, dY;


function updateDerivatives() {

  dX = myArray.getRandom(),

  dY = myArray.getRandom();

  console.log("Updated values:", { dX, dY });

}


setInterval(updateDerivatives, 1000);


查看完整回答
反對 回復 2022-10-13
?
江戶川亂折騰

TA貢獻1851條經驗 獲得超5個贊

使用setInterval() https://javascript.info/settimeout-setinterval

var myArray = [-3.5,0,3.5];

var dX, dY


setInterval(() => {

  dX = myArray[Math.floor(Math.random()*myArray.length)];

  dY = myArray[Math.floor(Math.random()*myArray.length)];

}, 1000)


查看完整回答
反對 回復 2022-10-13
?
藍山帝景

TA貢獻1843條經驗 獲得超7個贊

var myArray = [-3.5,0,3.5];


var dX;

var dY;


setInterval(() => { // you could also use setInterval(function(){...},...)

    dX = myArray[Math.floor(Math.random()*myArray.length)];

    dY = myArray[Math.floor(Math.random()*myArray.length)];

}, 1000) // 1000 milliseconds


查看完整回答
反對 回復 2022-10-13
  • 4 回答
  • 0 關注
  • 140 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號