J'écris un jeu sur toile qui implique de nombreux sprites sur la toile en même temps. Dans certains cas, les sprites ne sont pas visibles et pour sauvegarder les cycles de rendu, je ne les rends pas au canevas si le joueur ne les voit pas. Cela fonctionne très bien pour les sprites qui ne sont pas pivotés mais dès qu'ils sont tournés (en particulier les rectangles), je ne peux plus déterminer avec précision s'ils sont toujours dans la toile visible.Comment déterminez-vous en JavaScript si une image est en dehors du canevas visible après sa rotation?
Voici ce que je fais jusqu'à présent dans le cadre de ma boucle principale render:
if (image !== null) {
ctx.save();
ctx.translate(this.x, this.y);
ctx.rotate(this.rotation * Math.PI/180);
ctx.drawImage(image, 0,0, this.width, this.height);
ctx.restore();
}
Avant rendre le sprite en utilisant le code ci-dessus je déterminer si elle est visible à l'aide de ce code:
// Only draw sprite sthat are visible to the player.
if (sprite.x + boundingBox >= 0 && sprite.y + boundingBox >= 0 && sprite.x <= this.width && sprite.y <= this.height) {
sprite.draw(this.gameConsole.ctx);
}
Ce qui se passe, c'est qu'une fois que je fais tourner une image-objet non-uniforme, par exemple un rectangle, la largeur et la hauteur ne sont plus correctes car elles supposent qu'elles sont dans un état non-rotatif. Comment aborderiez-vous ce problème?
Vous et Casper aviez raison, mais il semble que votre approche était plus rapide (moins de calculs), mais je ne sais pas si cela signifie que je perdrai de la précision à long terme. – heavysixer
Je viens de supposer le pire des cas (lorsque le sprite est tourné de 45 degrés) et l'appliquer à tous les cas. Donc, parfois, vous pouvez encore dessiner des sprites de l'écran, mais seulement dans quelques cas et j'ai supposé que moins de calculs paieront à la longue. La réponse de Caspar est plus précise cependant. – Jan