javascript - 点坐标转换为Famo.us中的特定Surface

我们有一个内置于流星的非常复杂的Web应用程序。 UI主要位于嵌套的HTML元素中。现在，我们尝试使用Famo.us重写UI，以便我们可以有更好的性能并添加出色的动画效果。我们应用程序的一个功能是，当用户在元素A上方拖动时，我们需要根据B中鼠标事件的精确位置绘制一个新的元素B。也就是说，我们需要计算其中一个点的坐标任何元素，甚至元素都有复杂的变换。我们在webkit浏览器中使用了“ webkitConvertPointFromPageToNode”功能（我们仅支持webkit。）来完成这项工作。 Famo.us是否具有类似的功能，因此我可以计算特定Surface中的点坐标？或者，您对如何使用当前的API完成此类功能有任何建议？

谢谢

最佳答案

鉴于Famo.us中的所有变换都具有绝对定位的支持，因此在任何给定曲面中查找坐标都非常简单。在事件对象中，您可以获取目标曲面的offsetX和offsetY。

看看这个例子。

希望能帮助到你！

var Engine          = require('famous/core/Engine');
var Surface         = require('famous/core/Surface');
var StateModifier   = require('famous/modifiers/StateModifier');
var Transform       = require('famous/core/Transform');

var context = Engine.createContext();

var surface = new Surface({
    size:[200,200],
    properties: {
        backgroundColor:'green',
        color:'white',
        textAlign:'center',
        lineHeight:'200px'
    }
})

surface.on('mousemove',function(e){
    surface.setContent("x: "+e.offsetX+", y: "+e.offsetY);
})

surface.state = new StateModifier({
    transform: Transform.translate(100,100,0)
})

context.add(surface.state).add(surface);

关于javascript - 点坐标转换为Famo.us中的特定Surface，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23832299/