Question

我已经加载了我的svg图像，但是现在我想让它变得不可见。我找不到办法做到这一点......

var snapObj = Snap("#svgElement");
var group = snapObj.group();
var svgImage;

Snap.load("../img/image.svg", onImageLoaded);

function onImageLoaded(f) {
    svgImage = f;
    group.append(svgImage);
}

所以现在我需要知道svgImage的哪个属性我必须将图像的可见性更改为false。

Answer 1

我的一个朋友帮我解决了这个问题，你只能在一个组上使用attr方法，而不能在加载的svg上使用。因此，您需要将加载的svg添加到组中。

var snapObj = Snap("#svgElement");
var group = snapObj.group();
var svgImage;

Snap.load("../img/image.svg", onImageLoaded);

function onImageLoaded(f) {
    // we add the svg to a group
    svgImage = snapObj.group().append(f);
    // we add the group with the svg to our other group
    group.append(svgImage);

    // and we can set the visibility to hidden 
    // and the image in group will be invisible
    svgImage.attr({
        visibility: "hidden"
    });
}

Answer 2

另一种对我有用的方法：

var myPaper = Snap("#svgElement");
var theImage = myPaper.image("../img/image.svg");
theImage.attr({ display : "none" });

（改编自this post）

在snap.svg中使加载的svg不可见

2 个答案: