why my d3 selection index not working

Question

here is code fragment from label-drawing function

var legend = d3.select("." + to_chart)
    .append("g")
    .selectAll("g")
        .data(data)
            .enter().append("rect")
            .attr("width", 20)
            .attr("height", 20)
            .attr("x", 20)
            .attr("y", 20)
            .attr("transform", function(d, i){return "translate(0," + i * 30 + ")";})
            .attr("style", "stroke: #000; stroke-width: 1px")
            .attr("fill", function(d, i) { return color(i); });
var legend = d3.select("." + to_chart)
    .append("g")
    .attr("class", "t")
    .selectAll(".t")
        .data(data)
            .enter().append("text")
                    .attr("x", function(data, i){return i;})
                    .attr("y", 20)
                    .text(function(i){if (i = 0){
                        return "eff";
                    } else if (i = 1) {
                        return "non-eff";
                    }
                    ;});

why .attr("x", function(data, i){return i;}) is working, but .text section not? it always get the '1' value.

Answer 1

Ok, I put an example down...besides the problem I mentioned with the function(d,i){...}, your comparison operator was wrong...you want to use === or == instead of =. So here is the deal:

var data = ["mary","goes"]

var legend = d3.select("body").append("svg").append("g")
    .attr("class", "t")
    .selectAll(".t")
    .data(data)
    .enter()
  .append("text")
    .attr("x", function(d, i){return i * 30;})
    .attr("y", 20)
    .text(function(d,i){
        if (i === 0){
            return "eff";
        } else if (i === 1) {
            return "non-eff";
        }
    ;});

This results in:

eff non-eff