D3 js图表反转问题

Question

我的小提琴

我正在研究d3js，我得到了带有一些数据的条形图的此实现。 我需要反转图表。

我尝试添加：

var y = d3.scale.linear()
        .domain([0, d3.max(jsonData.year)])
        .range([500, 0]);

并在酒吧上打电话：

  .attr("y", function(d) {
            return y(d);
        });

没有工作..

我该如何解决？ 我认为缺少一些东西。这就是我想要的轴：

Answer 1

这个怎么样？ http://jsfiddle.net/jTs9A/3/

问题出在您的变换上，在底部附加x和y轴时平移坐标。

canvas.append("g")
    .call(xAxis)
    .attr("transform", "translate(0,0)");
canvas.append("g")
    .call(yAxis)
    .attr("transform", "translate(-10,0)");

您之前有（0,250）和（-10，-50）

编辑： http : //jsfiddle.net/jTs9A/4/

您需要添加以下内容：

 .attr("y", function(d) {
        return  (h- d.year*10);  //Height minus data value
    })

其中h是图形区域的高度。 检查评论中的tut（没有足够的代表）