简体   繁体   中英

Im trying to make a lottoticket for school, but when i have to draw the numbers it doesnt work(line 59)

Everything but whats in line 59 seems to be working. Im very new to coding, and dont really get so... I couldnt find the mistake, i suspect, that im missing a {} or () but i dont know. I think the only mistake is in "TegnKupon", because thats the part google chrome tells me to change.

I tried talking about it with some mates, but they couldnt help either. They made it but in another way, apparently.

<!DOCTYPE html>    
<html>    
<head>    
<canvas id="myCanvas" width="600" height="300" style="border:1px solid    #ff0000;"> 



</canvas>   

</head>    
<script type="text/javascript">   
function find_randomtal(limit)    
{    
    var random_tal    
        var cont = true    
        while (cont)    
        {
            random_tal=Math.round(Math.random()*100+1);
            if (random_tal <=limit)
            {
                cont = false
            }
        }
        return random_tal;
    }
var lottotal = [];
    function Findlottotal () 
    {
        var min=1; 
        var random_talny;
        var lottotal = [];
        for (var j=min; j<=7; j++) 
        {
            random_talny = find_randomtal(36);
            if (lottotal.indexOf(random_talny)<0) 
            {
                console.log(j + "random_talny: " + random_talny + " Findes ikke ");
                lottotal[j] = random_talny
            }
            else 
            {
                console.log (j + "random_talny: " + random_talny + " Findes ");
                j--
            }
        }
}
var canvas = document.getElementById('myCanvas');
var ctx = canvas.getContext("2d");

function TegnKupon()
{
    var taeller = 0
    for (var j=1;j<=4;j++)
    {
        for (var i=1;i<=9;i++)
        {
            taeller = taeller+1
            xpos=i*100-50
            ypos=100*j-50

            if (lottotal.indexOf(taeller)<0) 
            {
                ctx.beginPath();
                ctx.fillStyle = "rgb(255,255,255)"
                ctx.arc(xpos,ypos,50,0,2*Math.PI);
                ctx.fillText("tallet",x,y+10)
            }
            else
            {
                ctx.beginPath();
                ctx.fillStyle = "rgb(255,0,0)"
                ctx.arc(xpos,ypos,50,0,2*Math.PI);
                ctx.fillText("tallet",x,y+10)
            }


        }

    }

}
lottotal = Findlottotal()


</script>
<body onload="Findlottotal();TegnKupon()">

</body>
</html> 

A few things going on here...

First, x and y are undefined in TegnKupon . Maybe you wanted to use xPos and yPos ?

Next, I noticed that lottotal is being assigned the value of Findlottotal , but as it was, this function does not return anything. I've added a line at the bottom of Findlottotal to return lottotal .

Here's your snippet with my adjustments. It isn't giving console errors anymore.

<!DOCTYPE html>    
<html>    
<head>    
<canvas id="myCanvas" width="600" height="300" style="border:1px solid    #ff0000;"> 



</canvas>   

</head>    
<script type="text/javascript">   
  function find_randomtal(limit) {    
    var random_tal;
    var cont = true;

    while (cont) {
      random_tal = Math.round(Math.random() * 100 + 1);
      if (random_tal <= limit) {
        cont = false;
      }
    }
    return random_tal;
  }

  var lottotal = [];

  function Findlottotal () {
    var min = 1; 
    var random_talny;

    var lottotal = [];

    for (var j = min; j <= 7; j++) {
      random_talny = find_randomtal(36);
      if (lottotal.indexOf(random_talny) < 0) {
        console.log(j + "random_talny: " + random_talny + " Findes ikke ");
        lottotal[j] = random_talny;
      }
      else {
        console.log (j + "random_talny: " + random_talny + " Findes ");
        j--;
      }
    }

    return lottotal;
  }

  var canvas = document.getElementById('myCanvas');
  var ctx = canvas.getContext("2d");

  function TegnKupon()
  {
    var taeller = 0
    for (var j = 1; j <= 4; j++)
    {
      for (var i = 1; i <= 9; i++)
      {
        taeller = taeller + 1;
        xpos = i * 100 - 50
        ypos = 100 * j - 50;

        if (lottotal.indexOf(taeller) < 0) {
            ctx.beginPath();
            ctx.fillStyle = "rgb(255,255,255)";
            ctx.arc(xpos, ypos, 50, 0, 2 * Math.PI);
            ctx.fillText("tallet", xpos, ypos + 10);
        }
        else {
            ctx.beginPath();
            ctx.fillStyle = "rgb(255,0,0)"
            ctx.arc(xpos,ypos,50,0,2*Math.PI);
            ctx.fillText("tallet",xpos,ypos+10);
        }
      }
    }
  }

  lottotal = Findlottotal()


</script>
<body onload="Findlottotal();TegnKupon()">

</body>
</html> 

As the above to answers have shown, there was a few things I found wrong :) is this about what you're looking for?

 function find_randomtal(limit) { var random_tal var cont = true while (cont) { random_tal=Math.round(Math.random()*100+1); if (random_tal <=limit) { cont = false } } return random_tal; } function Findlottotal () { var min=0; var random_talny; var lottotal = []; for (var j=min; j<=7; j++) { random_talny = find_randomtal(36); if (lottotal.indexOf(random_talny)<0) { console.log(j + "random_talny: " + random_talny + " Findes ikke "); lottotal[j] = random_talny } else { console.log (j + "random_talny: " + random_talny + " Findes "); j-- } console.log(lottotal); } return lottotal; } var canvas = document.getElementById('myCanvas'); var ctx = canvas.getContext("2d"); function TegnKupon(lottotal) { var taeller = 0 for (var j=1;j<=4;j++) { for (var i=1;i<=9;i++) { taeller = taeller+1 xpos=i*100-50 ypos=100*j-50 console.log("taller " + lottotal); if (lottotal.indexOf(taeller)<0) { ctx.beginPath(); ctx.fillStyle = "rgb(255,255,255)" ctx.arc(xpos,ypos,50,0,2*Math.PI); ctx.fillText("tallet",xpos,ypos+10) } else { ctx.beginPath(); ctx.fillStyle = "rgb(255,0,0)" ctx.arc(xpos,ypos,50,0,2*Math.PI); ctx.fillText("tallet",xpos,ypos+10) } } } } document.getElementsByTagName("body")[0].onload = function() { var lottotal = Findlottotal(); TegnKupon(lottotal); }; 
 <!DOCTYPE html> <html> <head> </head> <canvas id="myCanvas" width="600" height="300" style="border:1px solid #ff0000;"> </canvas> <body> </body> </html> 

You shouldn't call your function that way. Instead, wrap those into a function called init and call it onload

function init(){
    Findlottotal();
    TegnKupon();
}

window.onload = init();

Also you are referencing x and y without defining them. I think perhaps you meant to say xpos and ypos ?

I'm not sure what output you're looking for, but I found 2 issues: 1. lottotal is not defined in function TengKupon 2. Also in TengKupon, in the if/else, ctx.filltext lists just "x" and "y". Did you mean to use "xpos" and "ypos" here? When I replaced them accordingly, I got a grid with 'tallet' either once (from the "if") or multiple times (from the "else")

So number 2 should be easy, but for number 1, I think the issue may be that you're not returning "lottotal" to make it available to TengKupon. Your error is saying "can not read indexof of undefined, which is referring to lottotal.

I assume you mean to return lottotal from FindLottotal, so I added "return lottotal" in the FindLottotal for loop, directly under the if else like so:

var lottotal = [];
    for (var j=min; j<=7; j++) 
    {
        random_talny = find_randomtal(36);
        if (lottotal.indexOf(random_talny)<0) 
        {
            console.log(j + "random_talny: " + random_talny + " Findes ikke ");
            lottotal[j] = random_talny
        }
        else 
        {
            console.log (j + "random_talny: " + random_talny + " Findes ");
            j--
        }
        return lottotal;
    }

Without knowing more about what you're looking for, I can't provide any more info, but hopefully this will get you to the next step.

Good luck!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM