在java脚本中绘制一条弧线，但它不出现

我正在处理一个简单的html/js项目以获得一个可以在可以拍摄球的画布中移动的框。我得到了箱子移动，但我不能让球出现。该程序使它到drawBall（）和moveBall（）（测试使用警报）功能，但他们什么都不做。我在过去的一个小时里一直在努力工作，所以我无法实现它。这里是我的JavaScript代码，它移动框，并且应该在空格键被释放时画一个球。在java脚本中绘制一条弧线，但它不出现

function init() { 
//canvas = document.getElementById('canvas'); 
context = $('#canvas')[0].getContext('2d'); 
WIDTH = $('#canvas').width(); 
HEIGHT = $('#canvas').height(); 
block_x = WIDTH/2; 
block_y = HEIGHT/2; 
setInterval('draw()', 25); 
} 

function clearCanvas() { 
    context.clearRect(0,0,WIDTH,HEIGHT); 
} 

function draw() { 
    clearCanvas(); 
    if(shotBall) 
    { 
     drawBall(); 
     moveBall(); 
    } 
    if (rightKey) block_x += 5; 
    else if (leftKey) block_x -= 5; 
    if (upKey) block_y -= 5; 
    else if (downKey) block_y += 5; 
    if (block_x <= 0) block_x = 0; 
    if ((block_x + block_w) >= WIDTH) block_x = WIDTH - block_w; 
    if (block_y <= 0) block_y = 0; 
    if ((block_y + block_h) >= HEIGHT) block_y = HEIGHT - block_h; 
    context.fillRect(block_x, block_y, block_w, block_h); 
} 

function drawBall() { 
     context.beginPath(); 
    context.arc(ball_x, ball_y, ball_radius, 0, Math.PI * 2, false); 
} 

function moveBall() { 
    ball_y += 1; 
    ball_x -= 1; 
} 

function onKeyDown(evt) { 
    if (evt.keyCode == 68) rightKey = true; 
    else if (evt.keyCode == 65) leftKey = true; 
    if (evt.keyCode == 87) upKey = true; 
    else if (evt.keyCode == 83) downKey = true; 
} 

function onKeyUp(evt) { 
    if (evt.keyCode == 68) rightKey = false; 
    else if (evt.keyCode == 65) leftKey = false; 
    if (evt.keyCode == 87) upKey = false; 
    else if (evt.keyCode == 83) downKey = false; 
    if(evt.keyCode == 32) createBall(); 
} 

function createBall() 
{ 
     ball_x = block_x + (block_w/2); 
     ball_y = block_y + (block_y/2); 
    radius = 20; 
    shotBall = true; 
} 
$(document).keydown(onKeyDown); 
$(document).keyup(onKeyUp);

来源

2012-03-20 DuxClarus

你正在得到什么错误？ – 2012-03-20 06:03:10

我使用adobe Dreamweaver编写代码，所以它不会给我一个错误。至少没有语法错误，它检查那些。除非有办法查看我不知道的Dreamweaver错误。但是，如果没有绘制弧线，没有错误。 – DuxClarus 2012-03-20 07:04:36

同样的结果，没有球。我尝试了context.stroke（）;/context.fill（）;以及它们两者的组合......并且如果我放入context.endPath（）;矩形也停止绘制。顺便谢谢你的帮助。 – DuxClarus 2012-03-20 19:27:15

当我想你的代码，我可以看到的问题是，你还没有初始化block_w，并BLOCK_H和ball_radius变量，因为这些值似乎是未定义正如我在萤火虫工具中看到的那样。

所以你必须确保你已经定义和初始化你使用的每个变量。另外您必须确保您正在调用您已定义的每个功能。当我在context.arc（23,34,45,0，Math.PI * 2，false）中手动输入值时，功能那么它适用于我。所以确保你已经定义并初始化了每个变量。

来源

2012-03-21 05:06:17

谢谢！它现在有效。尽管我在第一个函数上面定义了block_w和block_h，而不是在init（）中。我不知道我为什么最初做到了这一点，但现在您的建议已经奏效！：D快乐的日子！ – DuxClarus 2012-03-21 19:55:25

在java脚本中绘制一条弧线，但它不出现

回答

相关问题