0

在 RaphaelJS 中，我使用 path 函数来绘制一条黑线。这条线是可拖动的，但由于它的宽度，很难在平板电脑上拖动。我喜欢做的是用透明的“边框”填充线条。这样，这条线看起来不会更宽，但在平板设备上会有更多的区域可以抓住。有什么简单的方法可以做到这一点吗？

这是我如何画线的示例：

paper.path("M 150 250 h 200").attr({
fill: "#ff0",
gradient: "90-#526c7a-#64a0c1",
stroke: "#3b4449",
"stroke-width": 5
});
4

1 回答 1

0

答案可能取决于它是否会覆盖其他一些对象等。如果其他解决方案不起作用，您可以尝试将 2 个对象分组为一组，并将一个对象作为触发点。所以像下面...

var set = r.set();
var rect = r.rect(200,200,50,70).attr({ fill: 'red' });

set.push(
   r.path("M 150 250 h 200").attr({
    fill: "#ff0",
    gradient: "90-#526c7a-#64a0c1",
    stroke: "#3b4449",
    "stroke-width": 5
    })
    );
set.push( 
  r.path("M 150 250 h 200").attr({
    fill: "#ff0",
    gradient: "90-#526c7a-#64a0c1",
    stroke: "#3b4449",
    "stroke-width": 20,
    "stroke-opacity": 0.05,
    "stroke-linecap": "round"
    })
);

set.mouseover(function(){
alert('mouse over');
});

http://jsfiddle.net/Ap29U/2/上有一个小提琴显示它在另一个对象上（不透明度可以进一步调整，0.01 可能会使它几乎不可见）。我还刚刚在http://jsfiddle.net/Ap29U/3/添加了一个小提琴，展示了如何让它们一起移动。

于 2013-10-23T09:20:05.300 回答