Highlighted

eye follow cursor, in animate htm5 js canvas

New Here ,
Sep 26, 2020

Copy link to clipboard

Copied

hi, I need help I have this code to make an eye follow cursor, in animate htm5 js canvas but it doesn't work for me:

...

stage.canvas.style.cursor = "none"; 
this.eye.mouseEnabled = false; 
this.addEventListener("mouseMove", move.bind(this));

var root = this();



function move(event) {

      var var1 = mouseX - pendulo.x;

      var var2 = mouseY - pendulo.y;

      var radius = Math.atan2(var1,var2);

      var degree = radius /(Math.PI/180);

      root.eye.rotation = degree;

}

...

please help me.

Views

67

Likes

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

eye follow cursor, in animate htm5 js canvas

New Here ,
Sep 26, 2020

Copy link to clipboard

Copied

hi, I need help I have this code to make an eye follow cursor, in animate htm5 js canvas but it doesn't work for me:

...

stage.canvas.style.cursor = "none"; 
this.eye.mouseEnabled = false; 
this.addEventListener("mouseMove", move.bind(this));

var root = this();



function move(event) {

      var var1 = mouseX - pendulo.x;

      var var2 = mouseY - pendulo.y;

      var radius = Math.atan2(var1,var2);

      var degree = radius /(Math.PI/180);

      root.eye.rotation = degree;

}

...

please help me.

Views

68

Likes

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
Sep 26, 2020 0
Adobe Community Professional ,
Sep 26, 2020

Copy link to clipboard

Copied

I see variables mouseX and mouseY that you're using but that are never declared anywhere. Same for "pendulo".

Likes

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
Reply
Loading...
Sep 26, 2020 0
New Here ,
Sep 28, 2020

Copy link to clipboard

Copied

sorry the instance name is "pendulo", mouseX and mouse and I want to use it to call the position of the muouse. I already put it on stage, I don't get errors on the console but nothing happens yet.

stage.canvas.style.cursor = "none";
this.pendulo.mouseEnabled = false;
this.addEventListener("mouseMove", move.bind(this));

var root = this;



function move(event) {

	var var1 = stage.mouseX - pendulo.x;

	var var2 = stage.mouseY - pendulo.y;

	var radius = Math.atan2(var1, var2);

	var degree = radius / (Math.PI / 180);

	root.pendulo.rotation = degree;

}

 

Likes

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
Reply
Loading...
Sep 28, 2020 0
ClayUUID LATEST
Adobe Community Professional ,
Sep 28, 2020

Copy link to clipboard

Copied

There's no such mouse event as "mouseMove". Where did you get that from?

 

You should probably be listening for the "stagemousemove" event on the stage object.

https://www.createjs.com/docs/easeljs/classes/Stage.html#event_stagemousemove

 

Likes

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
Reply
Loading...
Sep 28, 2020 0