Question

我是d3.js（和stackoverflow）的新手，我正在研究并行坐标示例。我目前正在为数据使用名为'row'的二维数组。每个垂直轴上方是标签“0”或“1”或“2”等。但是，我希望每个垂直轴都用行[0] [i]中的文本标记。我相信数字0,1,2来自数据。关于如何使用行[0] [i]中的标签的任何建议？我怀疑我做错了，这是非常基本的。这是相关的代码。谢谢！

    // Extract the list of expressions and create a scale for each.
    x.domain(dimensions = d3.keys(row[0]).filter(function (d, i) {
        return row[0][i] != "name" &&
            (y[d] = d3.scale.linear()
                .domain(d3.extent(row, function (p) { return +p[d]; }))
                .range([height, 0]));
    }));

    // Add a group element for each dimension.
    var g = svg.selectAll(".dimension")
                .data(dimensions)
                .enter().append("g")
                .attr("class", "dimension")
                .attr("transform", function (d) { return "translate(" + x(d) + ")"; });

    // Add an axis and title.
    g.append("g")
            .attr("class", "axis")
            .each(function (d) { d3.select(this).call(axis.scale(y[d])); })
            .append("text")
            .attr("text-anchor", "middle")
            .attr("y", -9)
            .text(String);//.text(String)

Answer 1

如果您只有一组受控的轴（如三轴），您可能只想单独设置它们，如下所示......

svg.append("text").attr("class","First_Axis")
    .text("0")
    .attr("x", first_x_coordinate)
    .attr("y", constant_y_coordinate) 
    .attr("text-anchor","middle");

svg.append("text").attr("class","Second_Axis")
    .text("1")
    .attr("x", first_x_coordinate + controlled_offset)
    .attr("y", constant_y_coordinate) 
    .attr("text-anchor","middle");

svg.append("text").attr("class","Third_Axis")
    .text("2")
    .attr("x", first_x_coordinate + controlled_offset*2)
    .attr("y", constant_y_coordinate) 
    .attr("text-anchor","middle");

但是，如果您动态放置了依赖于数据的轴，则可能需要使用保持y坐标常量的函数放置轴信息，同时根据固定的“偏移量”确定x坐标（即数据驱动）轴放置）。例如......

svg.append("text")
    .attr("class",function(d, i) {return "Axis_" + i; })
    .text(function(d,i) {return i; })
    .attr("x", function(d, i) { return (x_root_coordinate + x_offset_value*i); })
    .attr("y", constant_y_coordinate) 
    .attr("text-anchor","middle");

我希望这会有所帮助。

谢

如何在平行坐标可视化中为每个垂直轴设置标签？

1 个答案: