Search code examples
kineticjs

Best practice for adding running total to KineticJS game?


I'm creating a game in kineticjs and I need to display a running total that acts as a score count.

I've tried the following:

 function scoreKeeper(){

  count++;

  var score = new Kinetic.Text({
    X:665,
    Y:280,
    text: count,
    fontSize:18,
    fill:'white'
})

  waveLayer.add(score);

};

setInterval(function(){
    scoreKeeper();
},100)

The problem with this is that the previous count value is not being removed. They start to layer on top of themselves and look like a white smudge of paint.

Does anybody know if there is something I can do to remove the old count values, or should I be looking to use another method altogether?

Please let me know, thanks!


Solution

  • I'm escalating this from the comments because it turned out it was the answer. The problem was that OP was re-creating the object inside the function which caused the "white smudge of paint" effect. The solution is to create the Kinetic.Text object once then call setText(count) to change the text.