我有一些新手问题。
在我的应用程序(processingjs)中,我使用scale()和translate()来允许用户缩放和滚动场景。只要我将比例设置为 1.0,就没有问题。但每当我使用比例(即比例(0.5))时,我都会迷失......
我需要将 mouseX 和 mouseY 转换为场景坐标,用它来确定在场景上绘制的对象的 mouseOver 状态。
有人能帮我翻译这些坐标吗?
提前致谢!
/理查德
不幸的是,对我来说这需要修改代码。我会考虑在某个时候将其提交到Processing.JS 代码存储库,但这就是我所做的。
首先,您需要使用模型 X() 和模型 Y() 来获取鼠标在世界视图中的坐标。看起来像这样:
float model_x = modelX(mouseX, mouseY);
float model_y = modelY(mouseX, mouseY);
不幸的是,Processing.JS 似乎无法在 2D 环境中正确计算 modelX() 和 modelY() 值。为了纠正这个问题,我将函数更改如下。请注意 mv.length == 16 的测试以及 2D 末尾的部分:
p.modelX = function(x, y, z) {
var mv = modelView.array();
if (mv.length == 16) {
var ci = cameraInv.array();
var ax = mv[0] * x + mv[1] * y + mv[2] * z + mv[3];
var ay = mv[4] * x + mv[5] * y + mv[6] * z + mv[7];
var az = mv[8] * x + mv[9] * y + mv[10] * z + mv[11];
var aw = mv[12] * x + mv[13] * y + mv[14] * z + mv[15];
var ox = 0, ow = 0;
var ox = ci[0] * ax + ci[1] * ay + ci[2] * az + ci[3] * aw;
var ow = ci[12] * ax + ci[13] * ay + ci[14] * az + ci[15] * aw;
return ow !== 0 ? ox / ow : ox
}
// We assume that we're in 2D
var mvi = modelView.get();
// NOTE that the modelViewInv doesn't seem to be correct in this case, so
// having to re-derive the inverse
mvi.invert();
return mvi.multX(x, y);
};
p.modelY = function(x, y, z) {
var mv = modelView.array();
if (mv.length == 16) {
var ci = cameraInv.array();
var ax = mv[0] * x + mv[1] * y + mv[2] * z + mv[3];
var ay = mv[4] * x + mv[5] * y + mv[6] * z + mv[7];
var az = mv[8] * x + mv[9] * y + mv[10] * z + mv[11];
var aw = mv[12] * x + mv[13] * y + mv[14] * z + mv[15];
var oy = ci[4] * ax + ci[5] * ay + ci[6] * az + ci[7] * aw;
var ow = ci[12] * ax + ci[13] * ay + ci[14] * az + ci[15] * aw;
return ow !== 0 ? oy / ow : oy
}
// We assume that we're in 2D
var mvi = modelView.get();
// NOTE that the modelViewInv doesn't seem to be correct in this case, so
// having to re-derive the inverse
mvi.invert();
return mvi.multY(x, y);
};
我希望这可以帮助其他遇到此问题的人。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)