为什么控制台没有显示错误但是就是不显示下面draw函数写上的内容

来源:2-4 身体升级准备

我爱你不如爱自己

2018-05-20 16:34

var dataObj=function(){


this.fruitNum=0;

this.double=1;


}

dataObj.prototype.reset=function(){


this.fruitNum=0;

this.double=1;


}

dataObj.prototype.draw=function(){

var w=can1.width;

var h=can1.height;

ctx1.fillStyle="white";

ctx1.fillText=("num"+this.fruitNum,w*0.5,h-50);

ctx1.fillText=("double"+this.double,w*0.5,h-80);



}

为什么控制台没有显示错误但是就是不显示下面draw函数写上的内容而且draw函数我也加入到主循环中了求大神解答一下

写回答 关注

3回答

  • jjboy
    2019-08-22 20:36:18

    同问,代码相同,主函数调用,HTML已添加,控制台不报错但是就是不显示数值

    main.js

    var can1;

    var can2;


    var ctx1;

    var ctx2;


    var lastTime;

    var deltaTime;


    var canWidth;

    var canHeight;


    var bgPic = new Image();

    var ane;

    var fruit;


    var mom;

    var mx;

    var my;


    var baby;

    var babyTail = [];

    var babyEye = [];

    var babyBody = [];


    var momTail=[];

    var momEye=[];

    var momBodyOrange=[];

    var momBodyBlue=[];


    var data;


    document.body.onload = game;


    function game() {

    init();

    lastTime = Date.now();

    deltaTime = 0;


    gameloop();

    }


    function init() {

    //获得canvas内容

    can1 = document.getElementById("canvas1");

    ctx1 = can1.getContext('2d');

    can2 = document.getElementById("canvas2");

    ctx2 = can2.getContext('2d');


    can1.addEventListener('mousemove', onmouseMove, false);


    bgPic.src = "img/background.jpg";

    canWidth = can1.width;

    canHeight = can1.height;


    ane = new aneObj();

    ane.init();


    fruit = new fruitObj();

    fruit.init();


    mom = new momObj();

    mom.init();


    baby = new babyObj();

    baby.init();


    mx = canWidth * 0.5;

    my = canHeight * 0.5;


    for (var i = 0; i < 8; i++) {

    babyTail[i] = new Image();

    babyTail[i].src = "./img/babyTail" + i + ".png";

    }



    for (var i = 0; i < 2; i++) {

    babyEye[i] = new Image();

    babyEye[i].src = "./img/babyEye" + i + ".png";

    }


    for (var i = 0; i < 20; i++) {

    babyBody[i] = new Image();

    babyBody[i].src = "./img/babyFade" + i + ".png";

    }

    for (var i = 0; i < 8; i++) {

    momTail[i] = new Image();

    momTail[i].src = "./img/bigTail" + i + ".png";

    }

    for (var i = 0; i < 2; i++) {

    momEye[i] = new Image();

    momEye[i].src = "./img/bigEye" + i + ".png";

    }

    data=new dataObj();

    for (var i = 0; i < 8; i++) {

    momBodyOrange[i] = new Image();

    momBodyOrange[i].src = "./img/bigSwim" + i + ".png";

    momBodyBlue[i] = new Image();

    momBodyBlue[i].src = "./img/bigSwimBlue" + i + ".png";

    }

    }


    function gameloop() {

    requestAnimationFrame(gameloop); //比起setInterval,setTimeout更加科学,但是有动态时间间隔

    var now = Date.now();

    deltaTime = now - lastTime;

    lastTime = now;

    if (deltaTime > 40) deltaTime = 40;


    drawBackground();

    ane.draw();

    fruitMonitor();

    fruit.draw();

    ctx1.clearRect(0, 0, canWidth, canHeight);

    mom.draw();

    baby.draw();

    momFruitsCollision();

    momBabyCollision();

    data.draw();

    }


    function onmouseMove(event) {

    if (event.offsetX || event.layerX) {

    mx = event.offsetX == undefined ? event.layerX : event.offsetX;

    my = event.offsetY == undefined ? event.layerY : event.offsetY;

    }

    }

    data.js

    var dataObj = function() {

    this.fruitNum = 0;

    this.double = 1;

    }


    dataObj.prototype.reset=function() {

    this.fruitNum = 0;

    this.double = 1;

    }


    dataObj.prototype.draw = function() {

    var w = can1.width;

    var h = can1.height;

    ctx1.fillStyle = "white";

    ctx1.fillText = ("num" + this.fruitNum, w * 0.5, h - 50);

    ctx1.fillText = ("double " + this.double, w * 0.5, h - 80);

    }

    collision.js

    //judge the distance between mom fish and fruit

    function momFruitsCollision() {

    for (var i = 0; i < fruit.num; i++) {

    if (fruit.alive[i]) {

    //calculate length

    var l = calLength2(fruit.x[i], fruit.y[i], mom.x, mom.y);

    if (l < 900) {

    //fruit eaten

    fruit.dead(i);

    data.fruitNum++;

    mom.momBodyCount++;

    if(mom.momBodyCount>7){

    mom.momBodyCount=7;

    }

    if (fruit.fruitType[i]=="blue") {

    data.double = 2;

    } //blue fruit

    }

    }

    }

    }


    //mom baby collision

    function momBabyCollision() {

    var l = calLength2(mom.x, mom.y, baby.x, baby.y);

    if (l < 900) {

    //baby recover

    baby.babyBodyCount = 0;

    //data==>0

    data.reset();

    mom.momBodyCount=0;

    }

    }


  • qq_俺为梦香耳塞_0
    2018-06-22 16:36:08

    在主循环中调用了吗

  • qq_俺为梦香耳塞_0
    2018-06-22 16:36:07

    在主循环中调用了吗

HTML5小游戏---爱心鱼(下)

通过一个清新美好的小游戏教程,熟悉游戏开发流程

46272 学习 · 189 问题

查看课程

相似问题