• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Can I draw a chart with mouse click in Animate?

Explorer ,
Apr 09, 2021 Apr 09, 2021

Copy link to clipboard

Copied

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.

 

Screenshot_35.jpg

Views

230

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 09, 2021 Apr 09, 2021

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Apr 14, 2021 Apr 14, 2021

Copy link to clipboard

Copied

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Explorer ,
Apr 19, 2021 Apr 19, 2021

Copy link to clipboard

Copied

LATEST

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);
}

 

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines