码迷,mamicode.com
首页 > Web开发 > 详细

D3.js 加标签

时间:2018-11-16 17:22:54      阅读:324      评论:0      收藏:0      [点我收藏+]

标签:nbsp   分享图片   length   function   func   append   ima   hit   font   

条形图还可以配上实际的数值,我们通过文本元素添加数据值。

svg.selectAll("text")
    .data(dataset)
    .enter()
    .append("text")
    .text(function(d){
        return d;
    })

通过 x 和 y 值来定位文本元素。

               .attr("text-anchor", "middle")
               .attr("x", function(d, i) {
                       return i * (w / dataset.length) + (w / dataset.length - barPadding) / 2;
               })
               .attr("y", function(d) {
                       return h - (d * 4) + 14;
               })
               .attr("font-family", "sans-serif")
               .attr("font-size", "11px")
               .attr("fill", "white");

 

结果如图所示:

技术分享图片

 

D3.js 加标签

标签:nbsp   分享图片   length   function   func   append   ima   hit   font   

原文地址:https://www.cnblogs.com/guangluwutu/p/9969673.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!