Question

嘿伙计们我正在浏览 THIS snap.svg演示，现在当我检查本地计算机上的代码时，它看起来如下：

        var g = Snap();
        g.attr({
            viewBox: [0, 0, 800, 600]
        });

        Snap.load("map.svg", function (f) {
            function getShift(dot) {
                return "t" + (400 - dot.x) + "," + (300 - dot.y);
            }
            var gr = f.select("g"),
                wrd = f.select("#world").attr({fill: "#fff"}),
                syd = f.select("#sydney").attr({fill: "red"}),
                msk = f.select("#san_francisco").attr({fill: "red"}),
                pth = f.select("#flight"),
                pln = f.select("#plane"),
                top = g.g();
            top.attr({
                mask: g.rect(100, 0, 600, 600).attr({
                    fill: "r(.5,.5,.25)#fff-#000"
                })
            });

我只是发布了我难以理解的代码的初始部分，在上面的代码部分中有以下行：

top = g.g();

现在看一下片段，您可以看到g是snap()的一个实例，但为什么上面的代码行？我正在处理的SVG是 THIS 。

我不太了解代码行g.g()。谁能解释一下？

Answer 1

奇怪的是他们的代码有点令人困惑。首先，我不会这样做，我有点惊讶......

var g = Snap();

通常意味着＆＃39; group＆＃39;。但是，Snap（）不会返回一个组，它会返回一个Snap＆＃39; svg＆＃39;元件。

所以相反我认为他们现在通常会做以下事情，这样做会更好......

var s = Snap()   // its an svg or snap instance

或

var paper = Snap() // its typically known as a paper you draw on

那么它会导致这条线，而且看起来像＃39;阅读时更正确...

var top = paper.group() // you can use g and group interchangeably.

这意味着添加一个＆＃39;组＆＃39;容器到paper / svg元素。

什么是快照SVG中的g（）

1 个答案: