Алина Брэнн

Строка 133, заменить строку как тут. И расчет trX trY чуть выше тоже можно закомментировать.

displayValue = function() {
                texts.append("text")
                    .text(function(){
                        return dataset[0].value;
                    })
                    .attr('id', "Value")
                    // .attr('transform', "translate(" + trX + ", " + trY+ ")")
                    .attr('transform', "translate(" + (width + margin.left) + ", " + ((height + margin.top) / 1.5) + ")")
                    .attr("font-size",18)
                    .style("fill", '#000000');
            }

Зачем тут флекс?
https://jsfiddle.net/webirus/8ujpfqrm/

codepen

Есть 2 современных способа это сделать динамически

1 - flexbox

header {
  height: 100vh;
  min-height: 600px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

2 - transform:

header {
  height: 100vh;
  min-height: 600px;
  position:relative
}
.container-fluid {
  left:0;
  width:100%;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

3 - display: table и в нем display:table-cell; vertical-align:middle;

остальные требуют знать заранее высоту

.clearfix { display: block; }
.clearfix:after { content: ""; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; margin: 0; padding: 0; }

Применить к родителю