如何在d3.js v4中的垂直堆积条形图中的每个条形图中添加数据标签？

Question

我想为每个堆积的条形图添加标签文本 帮助我如何在d3.js v4中的垂直堆积条形图中的每个条形图中添加数据标签？ 这是我的代码：

           /*stacked bar chart start*/
            var margin = {
              top: 40,
              right: 20,
              bottom: 40,
              left: 40
            }

            var width = 800 - margin.left - margin.right
            var height = 350 - margin.top - margin.bottom

            var data = [{
                    day: 'Mon',
                    apricots: 120,
                    blueberries: 180,
                    cherries: 100
                },
                {
                    day: 'Tue',
                    apricots: 60,
                    blueberries: 185,
                    cherries: 105
                },
                {
                    day: 'Wed',
                    apricots: 100,
                    blueberries: 215,
                    cherries: 110
                },
                {
                    day: 'Thu',
                    apricots: 150,
                    blueberries: 330,
                    cherries: 105
                },
                {
                    day: 'Fri',
                    apricots: 120,
                    blueberries: 240,
                    cherries: 105
                }
            ];

            var svg_stacked = d3.select('#stackedBar')
                .append('svg').classed('stackGraph', true)
                .attr('width', width + margin.left + margin.right)
                .attr('height', height + margin.top + margin.bottom)
                .append('g').classed('stack_g', true)
                .attr('transform', 'translate(' + margin.left + ',' + margin.top + ')')

            var colors = ['#FBB65B', '#513551', '#de3163'];

            var stack = d3.stack()
                .keys(['apricots', 'blueberries', 'cherries']);

            var stackedSeries = stack(data);

            // Create a g element for each series
            var g = d3.select('.stack_g')
                .selectAll('g')
                .data(stackedSeries)
                .enter()
                .append('g')
                .classed('series', true)
                .style('fill', (d, i) => {
                    return colors[i];
                });

            var stack_x = d3.scaleBand()
                .rangeRound([0, width])
                .padding(0.1)

            var stack_y = d3.scaleLinear()
                .range([height, 0])

            stack_x.domain(data.map((d) => {
                return d.day
            }))

            stack_y.domain([0, d3.max(stackedSeries, function (d) {
                return d3.max(d, function (d) {
                    return d[0] + d[1];
                });
            })])

            svg_stacked.append('g')
                .attr('class', 'x axis')
                .attr('transform', 'translate(0, ' + height + ')')
                .call(d3.axisBottom(stack_x))

            svg_stacked.append('g')
                .attr('class', 'y axis')
                .call(d3.axisLeft(stack_y))

            // For each series create a rect element for each day
            g.selectAll('rect')
                .data((d) => {
                    return d;
                })
                .enter()
                .append('rect')
                .attr('height', (d) => {
                    return stack_y(d[0]) - stack_y(d[0] + d[1]);
                })

                .attr('y', (d) => {
                    return stack_y(d[0] + d[1]);
                })
                .attr('x', (d, i) => {
                    return stack_x(d.data.day)
                })

                .attr('width', stack_x.bandwidth())
                .style("stroke", "#ccc");
            g.selectAll("text")
            .data(data)
            .enter()
            .append("text")
            .text(function (d) { return d.sightingCount; })
            .attr("x", function (d) { return  stack_x(d.data.day)+  stack_x.bandwidth() / 2; })
            .attr("y", function (d) { return stack_y(d[0] + d[1]) + 12; })
            .style("fill", "white");

        });