华硕板岩平板电脑上的RaphaelJS Touch支持

时间:2012-09-11 17:52:03

标签: svg touch raphael

我发现自己处于一个相当脆弱的境地,我正在开发一个Web应用程序,其界面几乎完全用RaphaelJS作为SVG的前端表达,但是没有访问目标系统(不要让我启动)。目标系统是运行Windows 7的Asus Slate device,并且启用了触摸屏。

我的理解是Raphael的drag支持会自动包含简单的触摸事件 - 因此触摸屏会自动像鼠标一样运行。然而,可拖动的元素在平板上变得不相互作用。我尝试过使用Raphael的touchstarttouchendtouchmove事件,这些事件与我传递给drag的函数相同,如下所示:

var element = canvas.circle( canvas.cwidth / 2, canvas.cheight / 2, 100 ).attr( { fill: 'red', stroke: 'black', 'stroke-width': 5, cursor: 'move' } );

var startDrag = function( x, y )
{
    console.log("starting drag" );
    element.attr( { 'fill-opacity': 0.5 } );
};
var endDrag = function( x, y )
{
    console.log("stopping drag" );
    element.animate( { transform: "T0,0", fill: 'red', 'fill-opacity': 1 }, 1000, 'bounce' );
};
var continueDrag = function( dx, dy, x, y )
{        
    var r = Math.sqrt( dx * dx + dy * dy ) / ( canvas.cwidth / 2 ) * 255;
    var g = x / canvas.cwidth * 255;
    var b = y / canvas.cheight * 255;
    element.transform( [ "T", dx, dy ] );
    element.attr( 'fill', Raphael.rgb( r, g, b ) );
};

element.touchstart( startDrag );
element.touchend( endDrag );
element.touchmove( continueDrag );
element.drag( continueDrag, startDrag, endDrag );

不幸的是,这根本没有效果。

任何人都可以向我提供任何有用的设备,不包括飞往德克萨斯州以获得对目标设备的开发访问权限吗?

0 个答案:

没有答案