Skip to main content
Marampazú
Marampazú
Known Participant
January 5, 2018
Answered

Remove allChilds created with a ticker

  • January 5, 2018
  • 1 reply
  • 578 views

Hello again.

I'm doing a kind of chronometer using a graph that is drawing lines from the same axis to form a circle.

These lines are drawn with a ticker, with which the effect is as if it were filling the circle.

This exercise is a kind of evaluation, where the user will have limited time to answer a question.

At the moment it works, the chronometer is painted while the conditional I put my ticker lasts.

When the user responds, I have to delete this element from the screen, not the buttons or graphics that the scenario has. If I use removeAllChildren (), in effect, it erases everything on the screen which does not help.

If I put it removeChild (line) it does, however it only deletes the last drawn line. That's why I ask for your help, I do not know how I can erase from the screen the traced lines (which in this case are 360) to launch another question and start again.

I enclose the code used, the same and can serve someone with a similar exercise.

root = this;

var miTicker = createjs.Ticker.on ("tick", rotateDraw);

var color = "# 0fe";

var increment = 0;

function rotateDraw () {

//Process to draw line: Create, origin, properties, increase to paint in another position, turn, paint in stage, define index

line = new createjs.Shape ();

line.x = line.y = 150;

linea.graphics.beginStroke (color)

.setStrokeStyle (10, "round")

.moveTo (0, 0)

.lineTo (0, -145)

root.addChild (line);

root.setChildIndex (line, 0);

// Increment to turn

increment = increment + .5;

// Turn for the line

linea.rotation = increment;

if (increment == 360) {

createjs.Ticker.off ("tick", miTicker);

}

}

Thanks as always.

    This topic has been closed for replies.
    Correct answer kglad

    either way.  with code:

    root = this;

    var mc = new createjs.MovieClip();

    root.addChild(mc);

    var miTicker = createjs.Ticker.on("tick", rotateDraw);

    var color = "# 0fe";

    var increment = 0;

    function rotateDraw() {

    //Process to draw line: Create, origin, properties, increase to paint in another position, turn, paint in stage, define index

    line = new createjs.Shape();

    line.x = line.y = 150;

    line.graphics.beginStroke(color).setStrokeStyle(10, "round").moveTo(0, 0).lineTo(0, -145)

    mc.addChild(line);

    mc.setChildIndex(line, 0);

    // Increment to turn

    increment = increment + .5;

    // Turn for the line

    line.rotation = increment;

    if (increment == 360) {

    createjs.Ticker.off("tick", miTicker);

    }

    }

    // call this when you want to remove the lines

    function removeLinesF(){

    root.removeChild(mc);

    }

    1 reply

    kglad
    Community Expert
    kgladCommunity Expert
    Community Expert
    January 5, 2018

    instead of use root=this, use a movieclip to add your lines to.  then you can just remove the movieclip with you want to remove the lines.

    p.s. you have some errors in your code. the first i see is linea is undefined

    Marampazú
    MarampazúAuthor
    Known Participant
    January 5, 2018

    I put all the code with google translate, I did not realize the error in the translation.
    I put the correct code again.

    function rotateDraw () {

    //Process to draw line: Create, origin, properties, increase to paint in another position, turn, paint in stage, define index

    line = new createjs.Shape ();

    line.x = line.y = 150;

    line.graphics.beginStroke (color)

    .setStrokeStyle (10, "round")

    .moveTo (0, 0)

    .lineTo (0, -145)

    root.addChild (line);

    root.setChildIndex (line, 0);

    // Increment to turn

    increment = increment + .5;

    // Turn for the line

    line.rotation = increment;

    if (increment == 360) {

    createjs.Ticker.off ("tick", miTicker);

    }

    }


    Thanks for the help, however I do not know exactly how to generate that movieclip you mention. Is it to generate a movieclip on the stage and inside it to put the code that I wrote and only make the movie invisible? Or is it to generate this movieclip dynamically and likewise remove it from the screen?

    Again, thank you very much.

    kglad
    Community Expert
    kgladCommunity ExpertCorrect answer
    Community Expert
    January 5, 2018

    either way.  with code:

    root = this;

    var mc = new createjs.MovieClip();

    root.addChild(mc);

    var miTicker = createjs.Ticker.on("tick", rotateDraw);

    var color = "# 0fe";

    var increment = 0;

    function rotateDraw() {

    //Process to draw line: Create, origin, properties, increase to paint in another position, turn, paint in stage, define index

    line = new createjs.Shape();

    line.x = line.y = 150;

    line.graphics.beginStroke(color).setStrokeStyle(10, "round").moveTo(0, 0).lineTo(0, -145)

    mc.addChild(line);

    mc.setChildIndex(line, 0);

    // Increment to turn

    increment = increment + .5;

    // Turn for the line

    line.rotation = increment;

    if (increment == 360) {

    createjs.Ticker.off("tick", miTicker);

    }

    }

    // call this when you want to remove the lines

    function removeLinesF(){

    root.removeChild(mc);

    }

      Terms & ConditionsAccessibility statement
      Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices