Robot Question / Réponse (IA) 9

  • Auteur de la discussion ZZZ
  • Date de début
ZZZ
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Fofobot 🤖 a dit:
Pour définir les valeurs de `bulletAX` et `bulletAY` de manière à ce que √(bulletAX² + bulletAY²) = 10 et que (mouse.x - player.x) / bulletAX = (mouse.y - player.y) / bulletAY, nous devons utiliser des équations mathématiques.

Voici une solution avec des formules trigonométriques:

```
var bulletSpeed = 10;
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var distance = Math.sqrt(dx * dx + dy * dy);
var bulletRatio = bulletSpeed / distance;
var bulletAX = bulletRatio * dx;
var bulletAY = bulletRatio * dy;
```

Nous avons d'abord défini une variable `bulletSpeed` pour la vitesse de la balle.

Nous avons ensuite calculé la distance entre la souris et le joueur en utilisant le théorème de Pythagore.

Ensuite, nous avons calculé le ratio entre la vitesse de la balle et la distance en divisant `bulletSpeed` par `distance`.

Enfin, nous avons multiplié les différences x et y de la souris et du joueur par le ratio pour obtenir `bulletAX` et `bulletAY`.

Vous pouvez ensuite utiliser `bulletAX` et `bulletAY` pour animer la balle.
Cliquez pour agrandir...
JavaScript: 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var keys = {};
var mouse = {
    x: 0,
    y: 0
};
var angle = 0;

window.addEventListener('mousemove', function (event) {
    mouse.x = event.clientX;
    mouse.y = event.clientY;
});

window.addEventListener('keydown', function (event) {
    keys[event.keyCode] = true;
});

window.addEventListener('keyup', function (event) {
    delete keys[event.keyCode];
});

var player = {
    x: (canvas.width / 2),
    y: (canvas.height / 2),
    width: 41,
    height: 97,
    speed: 3,
    speedDiag: 3 / Math.sqrt(2),
};

player.image = new Image();
player.image.src = "./img/sprite.png";
player.image.onload = function () {
    loop();
};

player.shotLightImage = new Image();
player.shotLightImage.src = "./img/shotLight Img.png";
player.shotLightImage.onload = function () {
    loop();
}

player.bulletImg = new Image();
player.bulletImg.src = "./img/bullet Img.png";
player.bulletImg.onload = function () {
    loop();
}

function updateAngle() {
    var dx = mouse.x - player.x;
    var dy = mouse.y - player.y;
    angle = Math.atan2(dy, dx);
    angle += Math.PI / 2
}

function update() {
    if (keys[38] && !keys[37] && !keys[39]) {
        player.y -= player.speed;
    }
    if (keys[40] && !keys[37] && !keys[39]) {
        player.y += player.speed;
    }
    if (keys[37] && !keys[38] && !keys[40]) {
        player.x -= player.speed;
    }
    if (keys[39] && !keys[38] && !keys[40]) {
        player.x += player.speed;
    }
    if (keys[38] && keys[37]) {
        player.y -= player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[38] && keys[39]) {
        player.y -= player.speedDiag;
        player.x += player.speedDiag;
    }
    if (keys[40] && keys[37]) {
        player.y += player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[40] && keys[39]) {
        player.y += player.speedDiag;
        player.x += player.speedDiag;
    }
    updateAngle();
}

var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 60;
var shootIntervalId;
var bulletAX = 0;
var bulletAY = 0;
var bullet = false;

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "black";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.save();
    ctx.translate(player.x, player.y);
    ctx.rotate(angle);
    ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);

    if (shotLightVisible) {
        ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
        bulletAX = player.x;
        bulletAY = player.y;
        bullet = true;
    }

    ctx.restore();

    if (bullet) {
        ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
        bulletAX -= 10;
        bulletAY -= 10;
        if (bulletAX == -1000) {
            bullet = false;
        }
    }
}

document.addEventListener("mousedown", function () {
    var currentTime = Date.now();
    var timeSinceLastFire = currentTime - lastFireTime;
    if (timeSinceLastFire >= fireRate) {
        // tirer
        var AK47sound = new Audio("./sounds/AK-47.mp3");
        AK47sound.play();
        shotLightVisible = true;
        setTimeout(function () {
            shotLightVisible = false;
        }, 50);

        lastFireTime = currentTime;
    }
    clearInterval(shootIntervalId);
    shootIntervalId = setInterval(function () {
        var currentTime = Date.now();
        var timeSinceLastFire = currentTime - lastFireTime;
        if (timeSinceLastFire >= fireRate) {
            // tirer
            var AK47sound = new Audio("./sounds/AK-47.mp3");
            AK47sound.play();
            shotLightVisible = true;
            setTimeout(function () {
                shotLightVisible = false;
            }, 50);
            lastFireTime = currentTime;
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    draw();
    requestAnimationFrame(loop);
}

loop();

Ok et dans ce code, où est-ce que je la case, ton equation trigonométrique ?
 
Fofobot 🤖
Fofobot 🤖
Assistant virtuel
Donateur 🤲
Messages
3 016
Fofocoins
70 789
ZZZ a dit:
JavaScript: 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var keys = {};
var mouse = {
    x: 0,
    y: 0
};
var angle = 0;

window.addEventListener('mousemove', function (event) {
    mouse.x = event.clientX;
    mouse.y = event.clientY;
});

window.addEventListener('keydown', function (event) {
    keys[event.keyCode] = true;
});

window.addEventListener('keyup', function (event) {
    delete keys[event.keyCode];
});

var player = {
    x: (canvas.width / 2),
    y: (canvas.height / 2),
    width: 41,
    height: 97,
    speed: 3,
    speedDiag: 3 / Math.sqrt(2),
};

player.image = new Image();
player.image.src = "./img/sprite.png";
player.image.onload = function () {
    loop();
};

player.shotLightImage = new Image();
player.shotLightImage.src = "./img/shotLight Img.png";
player.shotLightImage.onload = function () {
    loop();
}

player.bulletImg = new Image();
player.bulletImg.src = "./img/bullet Img.png";
player.bulletImg.onload = function () {
    loop();
}

function updateAngle() {
    var dx = mouse.x - player.x;
    var dy = mouse.y - player.y;
    angle = Math.atan2(dy, dx);
    angle += Math.PI / 2
}

function update() {
    if (keys[38] && !keys[37] && !keys[39]) {
        player.y -= player.speed;
    }
    if (keys[40] && !keys[37] && !keys[39]) {
        player.y += player.speed;
    }
    if (keys[37] && !keys[38] && !keys[40]) {
        player.x -= player.speed;
    }
    if (keys[39] && !keys[38] && !keys[40]) {
        player.x += player.speed;
    }
    if (keys[38] && keys[37]) {
        player.y -= player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[38] && keys[39]) {
        player.y -= player.speedDiag;
        player.x += player.speedDiag;
    }
    if (keys[40] && keys[37]) {
        player.y += player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[40] && keys[39]) {
        player.y += player.speedDiag;
        player.x += player.speedDiag;
    }
    updateAngle();
}

var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 60;
var shootIntervalId;
var bulletAX = 0;
var bulletAY = 0;
var bullet = false;

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "black";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.save();
    ctx.translate(player.x, player.y);
    ctx.rotate(angle);
    ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);

    if (shotLightVisible) {
        ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
        bulletAX = player.x;
        bulletAY = player.y;
        bullet = true;
    }

    ctx.restore();

    if (bullet) {
        ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
        bulletAX -= 10;
        bulletAY -= 10;
        if (bulletAX == -1000) {
            bullet = false;
        }
    }
}

document.addEventListener("mousedown", function () {
    var currentTime = Date.now();
    var timeSinceLastFire = currentTime - lastFireTime;
    if (timeSinceLastFire >= fireRate) {
        // tirer
        var AK47sound = new Audio("./sounds/AK-47.mp3");
        AK47sound.play();
        shotLightVisible = true;
        setTimeout(function () {
            shotLightVisible = false;
        }, 50);

        lastFireTime = currentTime;
    }
    clearInterval(shootIntervalId);
    shootIntervalId = setInterval(function () {
        var currentTime = Date.now();
        var timeSinceLastFire = currentTime - lastFireTime;
        if (timeSinceLastFire >= fireRate) {
            // tirer
            var AK47sound = new Audio("./sounds/AK-47.mp3");
            AK47sound.play();
            shotLightVisible = true;
            setTimeout(function () {
                shotLightVisible = false;
            }, 50);
            lastFireTime = currentTime;
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    draw();
    requestAnimationFrame(loop);
}

loop();

Ok et dans ce code, où est-ce que je la case, ton equation trigonométrique ?
Cliquez pour agrandir...
Pour définir les valeurs de `bulletAX` et `bulletAY` de manière à ce que la distance parcourue par la balle lors de chaque itération soit de 10 pixels et que la direction de la balle soit alignée avec le vecteur entre le joueur et la souris, vous pouvez remplacer les lignes de code suivantes:

```
if (shotLightVisible) {
ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
bulletAX -= 10;
bulletAY -= 10;
if (bulletAX == -1000) {
bullet = false;
}
}
```

par les lignes de code suivantes:

```
if (shotLightVisible) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// calcul de la distance entre le joueur et la souris
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var distance = Math.sqrt(dx * dx + dy * dy);
// calcul des ratios pour aligner la balle sur le vecteur joueur-souris
var bulletRatioX = dx / distance;
var bulletRatioY = dy / distance;
// définition de la position de la balle
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// déplacement de la balle en fonction des vitesses x et y calculées
bulletAX += bulletRatioX * bulletSpeed;
bulletAY += bulletRatioY * bulletSpeed;
// dessin de la balle
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
// si la balle sort de l'écran, on la désactive
if (bulletAX < 0 || bulletAX > canvas.width || bulletAY < 0 || bulletAY > canvas.height
 
ZZZ
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Fofobot 🤖 a dit:
Pour définir les valeurs de `bulletAX` et `bulletAY` de manière à ce que la distance parcourue par la balle lors de chaque itération soit de 10 pixels et que la direction de la balle soit alignée avec le vecteur entre le joueur et la souris, vous pouvez remplacer les lignes de code suivantes:

```
if (shotLightVisible) {
ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
bulletAX -= 10;
bulletAY -= 10;
if (bulletAX == -1000) {
bullet = false;
}
}
```

par les lignes de code suivantes:

```
if (shotLightVisible) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// calcul de la distance entre le joueur et la souris
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var distance = Math.sqrt(dx * dx + dy * dy);
// calcul des ratios pour aligner la balle sur le vecteur joueur-souris
var bulletRatioX = dx / distance;
var bulletRatioY = dy / distance;
// définition de la position de la balle
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// déplacement de la balle en fonction des vitesses x et y calculées
bulletAX += bulletRatioX * bulletSpeed;
bulletAY += bulletRatioY * bulletSpeed;
// dessin de la balle
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
// si la balle sort de l'écran, on la désactive
if (bulletAX < 0 || bulletAX > canvas.width || bulletAY < 0 || bulletAY > canvas.height
Cliquez pour agrandir...
finis ton message stp
 
Fofobot 🤖
Fofobot 🤖
Assistant virtuel
Donateur 🤲
Messages
3 016
Fofocoins
70 789
ZZZ a dit:
finis ton message stp
Cliquez pour agrandir...
Désolé, mon message a été tronqué. Voici l'intégralité du code mis à jour:

```
if (shotLightVisible) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// calcul de la distance entre le joueur et la souris
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var distance = Math.sqrt(dx * dx + dy * dy);
// calcul des ratios pour aligner la balle sur le vecteur joueur-souris
var bulletRatioX = dx / distance;
var bulletRatioY = dy / distance;
// définition de la position de la balle
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// déplacement de la balle en fonction des vitesses x et y calculées
bulletAX += bulletRatioX * bulletSpeed;
bulletAY += bulletRatioY * bulletSpeed;
// dessin de la balle
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
// si la balle sort de l'écran, on la désactive
if (bulletAX < 0 || bulletAX > canvas.width || bulletAY < 0 || bulletAY > canvas.height) {
bullet = false;
}
}
```

Vous pouvez ajouter ces lignes de code juste après la définition de `var bulletAY` à 0.

Ces lignes de code calculent le ratio entre la distance parcourue et la distance totale entre le joueur et la souris, puis utilisent ce ratio pour calculer les vitesses x et y de la balle en fonction de l'angle entre le joueur et la souris. La balle est ensuite déplacée selon ces vitesses à chaque trame d'animation.
 
ZZZ
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
JavaScript: 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var keys = {};
var mouse = {
    x: 0,
    y: 0
};
var angle = 0;

window.addEventListener('mousemove', function (event) {
    mouse.x = event.clientX;
    mouse.y = event.clientY;
});

window.addEventListener('keydown', function (event) {
    keys[event.keyCode] = true;
});

window.addEventListener('keyup', function (event) {
    delete keys[event.keyCode];
});

var player = {
    x: (canvas.width / 2),
    y: (canvas.height / 2),
    width: 41,
    height: 97,
    speed: 3,
    speedDiag: 3 / Math.sqrt(2),
};

player.image = new Image();
player.image.src = "./img/sprite.png";
player.image.onload = function () {
    loop();
};

player.shotLightImage = new Image();
player.shotLightImage.src = "./img/shotLight Img.png";
player.shotLightImage.onload = function () {
    loop();
}

player.bulletImg = new Image();
player.bulletImg.src = "./img/bullet Img.png";
player.bulletImg.onload = function () {
    loop();
}

function updateAngle() {
    var dx = mouse.x - player.x;
    var dy = mouse.y - player.y;
    angle = Math.atan2(dy, dx);
    angle += Math.PI / 2
}

function update() {
    if (keys[38] && !keys[37] && !keys[39]) {
        player.y -= player.speed;
    }
    if (keys[40] && !keys[37] && !keys[39]) {
        player.y += player.speed;
    }
    if (keys[37] && !keys[38] && !keys[40]) {
        player.x -= player.speed;
    }
    if (keys[39] && !keys[38] && !keys[40]) {
        player.x += player.speed;
    }
    if (keys[38] && keys[37]) {
        player.y -= player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[38] && keys[39]) {
        player.y -= player.speedDiag;
        player.x += player.speedDiag;
    }
    if (keys[40] && keys[37]) {
        player.y += player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[40] && keys[39]) {
        player.y += player.speedDiag;
        player.x += player.speedDiag;
    }
    updateAngle();
}

var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 60;
var shootIntervalId;
var bulletAX = 0;
var bulletAY = 0;
var bullet = false;

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "black";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.save();
    ctx.translate(player.x, player.y);
    ctx.rotate(angle);
    ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);

    if (shotLightVisible) {
        ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
        bulletAX = player.x;
        bulletAY = player.y;
        bullet = true;
    }

    ctx.restore();

    if (bullet) {
        ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
        bulletAX -= 10;
        bulletAY -= 10;
        if (bulletAX == -1000) {
            bullet = false;
        }
    }
}

document.addEventListener("mousedown", function () {
    var currentTime = Date.now();
    var timeSinceLastFire = currentTime - lastFireTime;
    if (timeSinceLastFire >= fireRate) {
        // tirer
        var AK47sound = new Audio("./sounds/AK-47.mp3");
        AK47sound.play();
        shotLightVisible = true;
        setTimeout(function () {
            shotLightVisible = false;
        }, 50);

        lastFireTime = currentTime;
    }
    clearInterval(shootIntervalId);
    shootIntervalId = setInterval(function () {
        var currentTime = Date.now();
        var timeSinceLastFire = currentTime - lastFireTime;
        if (timeSinceLastFire >= fireRate) {
            // tirer
            var AK47sound = new Audio("./sounds/AK-47.mp3");
            AK47sound.play();
            shotLightVisible = true;
            setTimeout(function () {
                shotLightVisible = false;
            }, 50);
            lastFireTime = currentTime;
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    draw();
    requestAnimationFrame(loop);
}

loop();

Je veux que au tir (```if (bullet) {...}```), le projectile, au lieu d'aller en diagonale haut-gauche s'oriente vers la souris puis continue en ligne droite.
 
ZZZ
ZZZ
Passionné
Messages
1 400
Fofocoins
7 662
Personnalisation du groupe
Personnalisation pseudo
Fofobot 🤖 a dit:
Désolé, mon message a été tronqué. Voici l'intégralité du code mis à jour:

```
if (shotLightVisible) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// calcul de la distance entre le joueur et la souris
var dx = mouse.x - player.x;
var dy = mouse.y - player.y;
var distance = Math.sqrt(dx * dx + dy * dy);
// calcul des ratios pour aligner la balle sur le vecteur joueur-souris
var bulletRatioX = dx / distance;
var bulletRatioY = dy / distance;
// définition de la position de la balle
bulletAX = player.x;
bulletAY = player.y;
bullet = true;
}

if (bullet) {
// définition de la vitesse de la balle
var bulletSpeed = 10;
// déplacement de la balle en fonction des vitesses x et y calculées
bulletAX += bulletRatioX * bulletSpeed;
bulletAY += bulletRatioY * bulletSpeed;
// dessin de la balle
ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
// si la balle sort de l'écran, on la désactive
if (bulletAX < 0 || bulletAX > canvas.width || bulletAY < 0 || bulletAY > canvas.height) {
bullet = false;
}
}
```

Vous pouvez ajouter ces lignes de code juste après la définition de `var bulletAY` à 0.

Ces lignes de code calculent le ratio entre la distance parcourue et la distance totale entre le joueur et la souris, puis utilisent ce ratio pour calculer les vitesses x et y de la balle en fonction de l'angle entre le joueur et la souris. La balle est ensuite déplacée selon ces vitesses à chaque trame d'animation.
Cliquez pour agrandir...
JavaScript: 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var keys = {};
var mouse = {
    x: 0,
    y: 0
};
var angle = 0;

window.addEventListener('mousemove', function (event) {
    mouse.x = event.clientX;
    mouse.y = event.clientY;
});

window.addEventListener('keydown', function (event) {
    keys[event.keyCode] = true;
});

window.addEventListener('keyup', function (event) {
    delete keys[event.keyCode];
});

var player = {
    x: (canvas.width / 2),
    y: (canvas.height / 2),
    width: 41,
    height: 97,
    speed: 3,
    speedDiag: 3 / Math.sqrt(2),
};

player.image = new Image();
player.image.src = "./img/sprite.png";
player.image.onload = function () {
    loop();
};

player.shotLightImage = new Image();
player.shotLightImage.src = "./img/shotLight Img.png";
player.shotLightImage.onload = function () {
    loop();
}

player.bulletImg = new Image();
player.bulletImg.src = "./img/bullet Img.png";
player.bulletImg.onload = function () {
    loop();
}

function updateAngle() {
    var dx = mouse.x - player.x;
    var dy = mouse.y - player.y;
    angle = Math.atan2(dy, dx);
    angle += Math.PI / 2
}

function update() {
    if (keys[38] && !keys[37] && !keys[39]) {
        player.y -= player.speed;
    }
    if (keys[40] && !keys[37] && !keys[39]) {
        player.y += player.speed;
    }
    if (keys[37] && !keys[38] && !keys[40]) {
        player.x -= player.speed;
    }
    if (keys[39] && !keys[38] && !keys[40]) {
        player.x += player.speed;
    }
    if (keys[38] && keys[37]) {
        player.y -= player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[38] && keys[39]) {
        player.y -= player.speedDiag;
        player.x += player.speedDiag;
    }
    if (keys[40] && keys[37]) {
        player.y += player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[40] && keys[39]) {
        player.y += player.speedDiag;
        player.x += player.speedDiag;
    }
    updateAngle();
}

var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 60;
var shootIntervalId;
var bulletAX = 0;
var bulletAY = 0;
var bullet = false;

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "black";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.save();
    ctx.translate(player.x, player.y);
    ctx.rotate(angle);
    ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);

    if (shotLightVisible) {
        ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
        bulletAX = player.x;
        bulletAY = player.y;
        bullet = true;
    }

    ctx.restore();

    if (bullet) {
        ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
        bulletAX -= 10;
        bulletAY -= 10;
        if (bulletAX == -1000) {
            bullet = false;
        }
    }
}

document.addEventListener("mousedown", function () {
    var currentTime = Date.now();
    var timeSinceLastFire = currentTime - lastFireTime;
    if (timeSinceLastFire >= fireRate) {
        // tirer
        var AK47sound = new Audio("./sounds/AK-47.mp3");
        AK47sound.play();
        shotLightVisible = true;
        setTimeout(function () {
            shotLightVisible = false;
        }, 50);

        lastFireTime = currentTime;
    }
    clearInterval(shootIntervalId);
    shootIntervalId = setInterval(function () {
        var currentTime = Date.now();
        var timeSinceLastFire = currentTime - lastFireTime;
        if (timeSinceLastFire >= fireRate) {
            // tirer
            var AK47sound = new Audio("./sounds/AK-47.mp3");
            AK47sound.play();
            shotLightVisible = true;
            setTimeout(function () {
                shotLightVisible = false;
            }, 50);
            lastFireTime = currentTime;
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    draw();
    requestAnimationFrame(loop);
}

loop();

Je veux que au tir (```if (bullet) {...}```), le projectile, au lieu d'aller en diagonale haut-gauche s'oriente vers la souris puis continue en ligne droite.
 
Fofobot 🤖
Fofobot 🤖
Assistant virtuel
Donateur 🤲
Messages
3 016
Fofocoins
70 789
ZZZ a dit:
JavaScript: 
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');

canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;

var keys = {};
var mouse = {
    x: 0,
    y: 0
};
var angle = 0;

window.addEventListener('mousemove', function (event) {
    mouse.x = event.clientX;
    mouse.y = event.clientY;
});

window.addEventListener('keydown', function (event) {
    keys[event.keyCode] = true;
});

window.addEventListener('keyup', function (event) {
    delete keys[event.keyCode];
});

var player = {
    x: (canvas.width / 2),
    y: (canvas.height / 2),
    width: 41,
    height: 97,
    speed: 3,
    speedDiag: 3 / Math.sqrt(2),
};

player.image = new Image();
player.image.src = "./img/sprite.png";
player.image.onload = function () {
    loop();
};

player.shotLightImage = new Image();
player.shotLightImage.src = "./img/shotLight Img.png";
player.shotLightImage.onload = function () {
    loop();
}

player.bulletImg = new Image();
player.bulletImg.src = "./img/bullet Img.png";
player.bulletImg.onload = function () {
    loop();
}

function updateAngle() {
    var dx = mouse.x - player.x;
    var dy = mouse.y - player.y;
    angle = Math.atan2(dy, dx);
    angle += Math.PI / 2
}

function update() {
    if (keys[38] && !keys[37] && !keys[39]) {
        player.y -= player.speed;
    }
    if (keys[40] && !keys[37] && !keys[39]) {
        player.y += player.speed;
    }
    if (keys[37] && !keys[38] && !keys[40]) {
        player.x -= player.speed;
    }
    if (keys[39] && !keys[38] && !keys[40]) {
        player.x += player.speed;
    }
    if (keys[38] && keys[37]) {
        player.y -= player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[38] && keys[39]) {
        player.y -= player.speedDiag;
        player.x += player.speedDiag;
    }
    if (keys[40] && keys[37]) {
        player.y += player.speedDiag;
        player.x -= player.speedDiag;
    }
    if (keys[40] && keys[39]) {
        player.y += player.speedDiag;
        player.x += player.speedDiag;
    }
    updateAngle();
}

var shotLightVisible = false;
var lastFireTime = 0;
var fireRate = 60;
var shootIntervalId;
var bulletAX = 0;
var bulletAY = 0;
var bullet = false;

function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    ctx.fillStyle = "black";
    ctx.fillRect(0, 0, canvas.width, canvas.height);
    ctx.save();
    ctx.translate(player.x, player.y);
    ctx.rotate(angle);
    ctx.drawImage(player.image, -player.width / 2, -player.height + 45 / 2, player.width, player.height);

    if (shotLightVisible) {
        ctx.drawImage(player.shotLightImage, (-player.width) + 65 / 2, (-player.height / 2) - 42, 20, 20);
        bulletAX = player.x;
        bulletAY = player.y;
        bullet = true;
    }

    ctx.restore();

    if (bullet) {
        ctx.drawImage(player.bulletImg, bulletAX, bulletAY, 2, 34);
        bulletAX -= 10;
        bulletAY -= 10;
        if (bulletAX == -1000) {
            bullet = false;
        }
    }
}

document.addEventListener("mousedown", function () {
    var currentTime = Date.now();
    var timeSinceLastFire = currentTime - lastFireTime;
    if (timeSinceLastFire >= fireRate) {
        // tirer
        var AK47sound = new Audio("./sounds/AK-47.mp3");
        AK47sound.play();
        shotLightVisible = true;
        setTimeout(function () {
            shotLightVisible = false;
        }, 50);

        lastFireTime = currentTime;
    }
    clearInterval(shootIntervalId);
    shootIntervalId = setInterval(function () {
        var currentTime = Date.now();
        var timeSinceLastFire = currentTime - lastFireTime;
        if (timeSinceLastFire >= fireRate) {
            // tirer
            var AK47sound = new Audio("./sounds/AK-47.mp3");
            AK47sound.play();
            shotLightVisible = true;
            setTimeout(function () {
                shotLightVisible = false;
            }, 50);
            lastFireTime = currentTime;
        }
    }, fireRate);
});

document.addEventListener("mouseup", function () {
    clearInterval(shootIntervalId);
});

function loop() {
    update();
    draw();
    requestAnimationFrame(loop);
}

loop();

Je veux que au tir (```if (bullet) {...}```), le projectile, au lieu d'aller en diagonale haut-gauche s'oriente vers la souris puis continue en ligne droite.
Cliquez pour agrandir...
Sorry I couldn't contact the ChatGPT think tank :(
 
Vous devez vous connecter ou vous enregistrer pour répondre ici.
Sujets similaires Réponses Date
🤖 Robot Question / Réponse (IA) `08.07.2023` 1
🤖 Robot Question / Réponse (IA) 35
🤖 Robot Question / Réponse (IA) 58
🤖 Robot Question / Réponse (IA) 6
🤖 Robot Question / Réponse (IA) 105
Sujets similaires
Lancer une discussion 🚀…

S'inscrire gratuitement

Sujets populaires

Derniers messages

🚫 Alerte AdBlock !

Vous avez activé le mode Ninja, et il cache toutes les pubs ! 😆 Un petit coup de pouce pour notre site serait super apprécié si vous pouvez le désactiver. 🙏

🦸‍♂️ J'ai Désactivé AdBlock !