HTML5画布测速仪不需要与

我一直在使用的画布创建一个速度表表针超时（）工作，并且工作正常与一个canvas标签HTML5画布测速仪不需要与

我对针JavaScript是

function Speedometer(convas, score ,width_x, width_y ,height) 
    { 
    $('#Canvas_Exam').show(); 
     ctx = convas.getContext('2d'), 
     initialpoint = -90;   
     Target =-90 +180/100*score; 
     step = 1; 

    setInterval(function() { 
     if(Math.abs(Target - initialpoint) < step){ 
      initialpoint = Target; 
     }else{ 
      initialpoint += (Target > initialpoint) ? step : (Target < initialpoint) ? -step :0; 
     } 
     ctx.save(); 
     ctx.clearRect(0, 0, convas.width, convas.height); 
     ctx.translate(convas.width/2, convas.height/2+40); 
     ctx.rotate(initialpoint * Math.PI/180); 
     ctx.fillStyle = 'red'; 
     ctx.beginPath(); 
     ctx.moveTo(0,0); 
     ctx.lineTo(-width_x, -width_y); 
     ctx.lineTo(0, -height); 
     ctx.lineTo(width_x,- width_y); 
     ctx.lineTo(0,0); 
     ctx.fill(); 

     ctx.restore(); 
     },50); 
    }

和

var convas1 = document.getElementById('Canvas_Exam'); 
      Speedometer(convas1 ,data.d*10 ,4,12,65);

，但是当我使用第二画布标签一样，

var convas2 = document.getElementById('Canvas_Course'); 
      Speedometer(convas2 ,data.d*10 ,4,12,65);

针仅在Canvas_Course而不是Canvas_Exam中可见。我认为我在针的位置犯了错误。

任何人都可以提出我要做的事情。针对两个画布标签中的针头显示

来源

2013-05-16 DurGesh kuMar RAO

您有全局变量问题正在进行。在该函数内部声明的每个变量都是全局变量。 'var'不是可选的。 – epascarello

对不起，我没有使用全局变量，我在函数中使用变量，我将函数作为参数传递。 –

Thanku sir。现在它正在工作，非常感谢。 –

在变量前添加一个var以使它们变为私密。

function Speedometer(convas, score ,width_x, width_y ,height) { 

    $('#Canvas_Exam').show(); 
    var ctx = convas.getContext('2d'), 
     initialpoint = -90;   
     Target =-90 +180/100*score; 
     step = 1; 

// rest of your function 

}

现在为每个车速表初始化一个新的对象。

var convas1 = document.getElementById('Canvas_Exam'); 
var convas1Speedo = new Speedometer(convas1 ,data.d*10 ,4,12,65); 

var convas2 = document.getElementById('Canvas_Course'); 
var convas2Speedo = new Speedometer(convas2 ,data.d*10 ,4,12,65);

来源

2013-05-16 12:22:16

HTML5画布测速仪不需要与

回答

相关问题