0

CSV テーブルからロードされたデータで d3js を使用しています。これらの値をテーブルに入れ、列 2 と 3 の値に応じて列 10 のエントリの色を設定したいと考えています (たとえば、列 2 と 3 の値の合計が正の場合に何かを行います)。

エントリ自体の値に応じて 1 つのエントリに色を付ける方法は理解していますが、他の値に応じてこれを行うことは、私のプログラミング スキルを超えています。誰かがこれで私を助けることができますか?

d3.select("#viz")
    .append("table")
    .style("border-collapse", "collapse")
    .style("border", "2px black solid")

    .selectAll("tr")
    .data(parsedCSV)
    .enter().append("tr")

    .selectAll("td")
    .enter().append("td")
    .style("border", "1px black solid")
    .style("padding", "2px")
    .text(function(d){return d;})
4

1 に答える 1

1

行配列にアクセスできる場合は、これが最も簡単です。.each私はこの種のタスクに使用する傾向があります：

// ...snip...
.enter().append("tr")
.each(function(row) {
    // now the whole row array is in scope for all sub-elements
    d3.select(this)
      .selectAll("td")
        .data(function(d){ return d; })
      .enter().append("td")
        .style("border", "1px black solid")
        .style("padding", "2px")
        .style("background", function(d, i) {
            // get data for last sibling
            var prev = row[i - 1];
            // determine the color
            return prev == 1 ? 'yellow' :
                prev == 2 ? 'orange' :
                prev == 3 ? 'red' :
                'none';
        })
        .text(function(d){ return d; });
});

フィドルを参照してください: http://jsfiddle.net/V9vMW/

于 2013-09-09T23:09:15.960 に答える