Skip to main content
George Bernard
Inspiring
April 9, 2021
Question

Can I draw a chart with mouse click in Animate?

  • April 9, 2021
  • 1 reply
  • 400 views

As the title says, can i draw the graph by mouse click on the animate?

I draw a grid on animate, and then I want to click on the grid, draw a point and then join them together to create a line chart. Can I do it on Animate?

This is how I want to do it.

 

    This topic has been closed for replies.

    1 reply

    Joseph Labrecque
    Community Expert
    Community Expert
    April 9, 2021

    Sure. You can use a drawing API. If using HTML5 Canvas - have a look at the CreateJS docs: 
    https://createjs.com/docs 

    George Bernard
    Inspiring
    April 14, 2021

    I tried but didn't find what I expect. Can you help me a little bit? An example would be appreciated.

    George Bernard
    Inspiring
    April 20, 2021

    I followed this article and somehow make it work.

     

    createjs.Ticker.on("tick", stage);
    createjs.Touch.enable(stage);
    stage.enableMouseOver();
    stage.addEventListener("click", handleDrawCircle);
    
    function handleDrawCircle(event) {
    	console.log(stage.mouseX, stage.mouseY);
    
    	var thing = new createjs.Shape();
    	thing.graphics.setStrokeStyle(1);
    	thing.graphics.beginFill("#292B2C");
    	thing.graphics.drawCircle(stage.mouseX, stage.mouseY, 5);
    	root.addChild(thing);
    }