如何在rect的顶部附加值

时间:2016-10-24 08:07:28

标签: d3.js

我制作了一个垂直条形图并使用以下内容将文字附加到条形图上。  如果我将y属性设置为0,则文本显示在顶部,而不管条的长度如何,即使条长度为50,1,1,3,所有值也会粘在一起。  我需要的是值应该显示在栏的右上方。 我也尝试了文本锚点,但它没有用。

  sets.append("text")
                .attr("class", "global")
                //.attr("y", function(d) {
                 //   return yScale(d.global) ;
               // })
                .attr("dy", 5)
                .attr("dx",(xScale.rangeBand() / 4))
                .attr("font-family", "sans-serif") 
                .attr("font-size", "14px")
                .attr("fill", "black")
                .text(function(d) {
                    return ( commaFormat(d.global) > 0) ? commaFormat(d.global) : "";
                }); 

这是直接代码

 sets.append("rect")
                .attr("class","global")
                .attr("width", xScale.rangeBand()/2)
                .attr("y", function(d) {
                    return yScale((d.global/total)*100);
                })
                .attr("height", function(d){
                    return h - yScale((d.global/total)*100);
                })
                .attr('fill', function (d, i) {
                return color(d.global);
                }) 
                .append("text")
                .text(function(d) {
                    return commaFormat((d.global/total)*100);
                })
                //.attr('x', function(d, i) {
                //  return xScale(i) + xScale.rangeBand() / 2;
                //})
                //.attr('y', function(d) {
                //  return h - yScale((d.global/total)*100) + 14;
                //})
                .attr("font-family", "sans-serif") 
                .attr("font-size", "11px")

0 个答案:

没有答案