raphael - 我如何显示/隐藏带有按钮单击事件的 raphael 对象

Question

我想用按钮点击事件显示/隐藏我的 raphael svg 图

请知道该怎么做的人。请帮助我

我尝试通过这种方式来做，但它不起作用。

var p = Raphael(900,70,200,200);

p.circle(20,20,20); 
    $n("#shide").click(function(){
    p.hide();
    });

请知道该怎么做的人。请帮助我。
提前致谢。

Answer 1

最好使用绘图函数的返回值。

var element1 = p.circle(20,20,20);
var element2 = p.circle(99,99,20);
$n("#shide").click(function(){
    element1.hide();
    // element2.hide();
});

此外，我对此类问题也有一些高级技能。当您使用 ajax 响应数据绘制圆圈或其他东西时，这些技巧将非常有用。

function drawCircle() {
    var elementObj = {};
    $.ajax({url: '', dataType: 'json', method: 'post', data: yourData, success: function (data) {
        elementObj['circle1'] = p.circle(20,20,20);
        elementObj['circle2'] = p.circle(99,99,20);
    });
    return elementObj;
}

然后你像这样调用这个函数:

var ele = drawCircle();
var hoverInCb = function () {
    ele['circle1'] && ele['circle1'].show();
    ele['circle2'] && ele['circle2'].show();
};
var hoverOutCb = function () {
    ele['circle1'] && ele['circle1'].hide();
    ele['circle2'] && ele['circle2'].hide();
};

这些代码将起作用，因为返回的 elementObj 是对象的“链接”。 ajax请求取到数据后，elementObj会被填充数据，外面的ele变量也会得到新的数据。