D3.js 在点后面放置网格线

我已经创建了一个包含网格线和散点图的图形。我对网格线有问题，因为它位于散点图的顶部。我想把它放在散点图下面。我还知道d3.js按顺序执行语句。我把网格线的代码放在散点图的代码之前，但它不起作用。 这是我的图形图像链接 下面是我的代码

var x1 = d3.scale.log()
                .range([0, width - 200])
                .domain(d3.extent(data, function(d) { return d.PhIII_Effort; })).nice();

            var y1 = d3.scale.log()
                .range([height, 0])
                .domain(d3.extent(data, function(d) { return d.SizeNew_1; })).nice();


            function make_x_axis1() {
                return d3.svg.axis()
                .scale(x1)
                .orient("bottom")
                .ticks(5)
                }

            function make_y_axis1() {
                return d3.svg.axis()
                .scale(y1)
                .orient("left")
                .ticks(5)
                }

            svg1.append("g")
            .attr("class", "grid")
            .attr("transform", "translate(0," + height + ")")
            .call(make_x_axis1()
            .tickSize(-height, 0, 0)
            .tickFormat("")
            );

            svg1.append("g")
            .attr("class", "grid")
            .call(make_y_axis1()
            .tickSize(-width,0, 0)
            .tickFormat("")
            );

---

SVG元素按照它们附加到DOM的顺序呈现。如果网格线显示在实际绘图的前面，即使您正在运行代码以首先绘制网格线，您必须将其附加到实际绘图的

g

元素后。