什么是g()在snap SVG

What is g() in snap SVG

本文关键字：snap SVG 什么      更新时间：2023-09-26

嘿，伙计们，我正在通过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()代码行。有人能解释一下吗?

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

var g = Snap();

g通常表示"组"。然而，Snap()不返回一个组，它返回一个Snap 'svg'元素。

所以我认为他们通常会这样做，现在读起来更好…

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

或

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

那么它将导致这一行，这在阅读时看起来更正确…

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

这意味着添加一个'group'容器到paper/svg元素

相关文章：