problème de lignes de dessin

StackOverflow https://stackoverflow.com/questions/1232146

  •  22-07-2019
  •  | 
  •  

Question

J'ai une balise canvas, je l'utilise pour tracer des lignes, la toile est un carré. J'utilise " espace " enregistrer l'espace entre deux lignes. et j'ai canvasWidth et canvasHight pour enregistrer la taille de la toile, en fait, ils ont le même numéro .... 320 

        var x=0;
        for (var i = 0; i < 5; i++) {
            x = parseInt(x + space);

            myCanvas.fillStyle = "rgb(200,0,0)";
            myCanvas.fillRect(x, 1, 1, canvasHeight);
            myCanvas.fillStyle = "rgb(0,200,0)";
            myCanvas.fillRect(1, x, canvasWidth, 1);

        }

Je peux utiliser le dessin toutes les lignes rouges sur la toile, mais les lignes vertes peuvent seulement en dessiner deux sur la toile, les autres ne peuvent tout simplement pas apparaître, J'ai utilisé try {} catch, et aucune erreur ne disparaît.

Était-ce utile?

La solution

Quel navigateur utilisez-vous?

Le problème ne semble pas se trouver dans le code que vous avez montré, car cela fonctionne bien pour moi.

Voici mon exemple html: 

<!DOCTYPE html>
<html>
<body>
<canvas id="myCanvas" height="320" width="320" />

<script language="javascript">
var myCanvas = document.getElementById('myCanvas').getContext('2d');
var space = 10;
var x=0;
var canvasHeight = 320;
var canvasWidth = 320;
for (var i = 0; i < 5; i++) {
    x = parseInt(x + space);

    myCanvas.fillStyle = "rgb(200,0,0)";
    myCanvas.fillRect(x, 1, 1, canvasHeight);
    myCanvas.fillStyle = "rgb(0,200,0)";
    myCanvas.fillRect(1, x, canvasWidth, 1);

}
</script>

</body>
</html>

Autres conseils

Pourquoi utilisez-vous parseInt, votre variable d'espace a-t-elle un type de chaîne? Sinon, essayez de supprimer parseInt.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top