JS功能帮助 - 没有错误,但没有出现

时间:2017-05-05 04:38:36

标签: javascript function

我不确定我哪里出错了。我没有在控制台中收到任何错误,并且页面上没有显示任何内容。

如果有人可以看一看,也许会看到我错过的小事。



<!doctype html>
<html>
<head>
<script src="https://code.createjs.com/createjs-2015.11.26.min.js"></script>
<script>
  var myStage;
      
  function init(){
    myStage = new createjs.Stage(document.getElementById("myCanvas"));
    drawStar(50);
    myStage.update();
  }
        
  function drawStar(num){
    for(i=0; i<num; i++){
    
      var polygon = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      polygon.graphics.beginFill(color);
      polygon.graphics.moveTo(20, 80).lineTo(80, 80).lineTo(50, 120).lineTo(20, 80).lineTo(50, 40).lineTo(80, 80);
    
      var shape = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      shape.graphics.beginFill(color).drawCircle(20, 80, 3);
      shape.graphics.beginFill(color).drawCircle(80, 80, 3);
      shape.graphics.beginFill(color).drawCircle(50, 120, 3);
      shape.graphics.beginFill(color).drawCircle(50, 40, 3);
    
      var lines = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      lines.graphics.beginStroke(color);
      lines.graphics.moveTo(50, 80).lineTo(50, -5000).moveTo(50, 80).lineTo(-5000, 80).moveTo(50, 80).lineTo(10000, 80).moveTo(50, 80).lineTo(50, 10000);
      
      var container = new createjs.Container();
      container.addChild(lines,polygon,shape);
      
      container.x = Math.random()*1024;
      container.y = Math.random()*960;
      container.rotation = Math.random()*360;
      
      myStage.addChild(container);
    }
  }
//-->
</script>
<title>Generative Art</title>
</head>

<body>
  <canvas id="myCanvas" width="1500" height="1500">Sorry. You need an HTML5 compatible browser to see this.</canvas>
</body>
</html>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

您已编写了这些函数,但它们从未被调用过。

你必须调用它们才能执行它们内部的代码。

答案 1 :(得分:0)

正如其他人所说,你正在宣布这些功能,但从不打电话给他们。 像这样调用init:

<script>
  var myStage;

  function init(){
    myStage = new createjs.Stage(document.getElementById("myCanvas"));
    drawStar(50);
    myStage.update();
  }

  function drawStar(num){
    for(i=0; i<num; i++){

      var polygon = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      polygon.graphics.beginFill(color);
      polygon.graphics.moveTo(20, 80).lineTo(80, 80).lineTo(50, 120).lineTo(20, 80).lineTo(50, 40).lineTo(80, 80);

      var shape = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      shape.graphics.beginFill(color).drawCircle(20, 80, 3);
      shape.graphics.beginFill(color).drawCircle(80, 80, 3);
      shape.graphics.beginFill(color).drawCircle(50, 120, 3);
      shape.graphics.beginFill(color).drawCircle(50, 40, 3);

      var lines = new createjs.Shape();
      var color = '#'+(Math.random()*0xFFFFFF<<0).toString(16);
      lines.graphics.beginStroke(color);
      lines.graphics.moveTo(50, 80).lineTo(50, -5000).moveTo(50, 80).lineTo(-5000, 80).moveTo(50, 80).lineTo(10000, 80).moveTo(50, 80).lineTo(50, 10000);

      var container = new createjs.Container();
      container.addChild(lines,polygon,shape);

      container.x = Math.random()*1024;
      container.y = Math.random()*960;
      container.rotation = Math.random()*360;

      myStage.addChild(container);
    }
    init();
  }
//-->