feat(stage): recalculate mouse coordinates #1076
Conversation
When the canvas scrolls or zooms, the coordinates of the mouse relative to the canvas are not updated unless you move or click the mouse.
|
Added an exposed method( |
|
This is the test page that whether scrolling or zooming, mouseX and mouseY can be updated in time. <!DOCTYPE html>
<html lang="en">
<head>
<title>EaselJS demo: hitTest</title>
<style>
body {
margin: 0;
padding: 7px;
background-color: rgba(255, 255, 255, 0);
}
canvas {
border: solid 1px rgba(0, 0, 0, 0.05);
}
</style>
<script src="easeljs.min.js"></script>
</head>
<body>
<div>
<div style="width:200px;height:200px;background-color:#999999;overflow:auto;">
<canvas id="demoCanvas" width="600" height="300"></canvas>
</div>
</div>
<script>
var stage, circle;
function init() {
stage = new createjs.Stage("demoCanvas");
circle = stage.addChild(new createjs.Shape());
circle.graphics.beginFill("red").drawCircle(50, 50, 50);
circle.x = 0;
circle.y = 0;
createjs.Ticker.on("tick", tick);
}
function tick(event) {
circle.alpha = 0.2;
stage.recalculatePointerPosition();
if (circle.hitTest(stage.mouseX, stage.mouseY)) {
circle.alpha = 1;
}
stage.update(event);
}
init();
</script>
</body>
</html> |
If you do not want to add external interfaces, you can achieve the same effect by adding a listener for the resize and scroll events. |
|
Hi @stfujnkk - sorry to get here late. How are these changes going for you? Still working out okay? I verified that it works - thanks. Just trying to figure out if we should be checking screen ratio every mouse move in order to know the mouse position if it has not moved. As it is now, after zooming the browser, the mouse may be considered not hitting something or rolling over something until it is moved again. And perhaps the opposite too - all of a sudden it would seem to be hitting something or rolling over something that is not really under the mouse. Your solution currently requires people to still add a test and call the recalculatePointerPosition() - like in a Ticker or an event. I think for now, you have shown how this can be solved and if people are worried about it, they can implement your change. We will leave the master without the update. Anyone reading this, is welcome to weigh in. And thanks again for the solution. |
When the canvas scrolls or zooms, the coordinates of the mouse relative to the canvas are not updated unless you move or click the mouse.