小编Sta*_*hns的帖子

如何在不更改坐标的情况下转换(旋转)svg 文本元素?

我是这个 d3.js 的新手。在这里,我尝试使用 d3.v3.js 库绘制条形图。在这里,我面临着一些问题。我试图在 y 轴上包含度量标签。但是一旦我将标签转换为 -90 度,它的位置就会自动改变。

这是我用来绘制的代码:

    svg.append("g")
    .attr("id","x_axis")
    .attr("class", "x axis")
    .attr("transform", "translate(0," + height + ")")
    .call(xAxis)
    .selectAll("text")  
    .style("text-anchor", "end")
    .attr("dx", "-.8em")
    .attr("dy", ".15em")
    .attr("transform", "rotate(-65)");
    // .attr("transform", "translate(" + bandSize + ", 0)")

    svg.append("g")
    .attr("class", "x axis")
    .attr("id","dimLabel")
    .append("text")
    .style("text-anchor", "end")
    .attr("x", width/2)
    .attr("y", height+55) 
    .text(dimensionLabels[0]);




    svg.append("g")
    .attr("id","y_axis1")
    .attr("class", "y axis")
    .call(yAxis)
    .append("text")
    .attr("class", "label")
    //.attr("transform", "rotate(-90)")
    .attr("y", function(d){return y(d3.max(data, function(d) { return d.Metric1; }));});


    //Measure Labels
    svg.append("g")
    .attr("class", "y axis")
    .attr("id","measureLabels")
    .append("text")
    .style("text-anchor", …
Run Code Online (Sandbox Code Playgroud)

javascript svg bar-chart d3.js

2
推荐指数
1
解决办法
4433
查看次数

标签 统计

bar-chart ×1

d3.js ×1

javascript ×1

svg ×1