chart4 = {
const svg = d3.create("svg")
.attr("viewBox", [0, 0, width, 33])
.attr("font-family", "sans-serif")
.attr("font-size", 10)
.style("display", "block");
let text = svg.selectAll("text");
return Object.assign(svg.node(), {
update(letters) {
const t = svg.transition().duration(750);
text = text
.data(letters, d => d)
.join(
enter => enter.append("text")
.attr("y", -7)
.attr("dy", "0.35em")
.attr("x", (d, i) => i * 17)
.text(d => d),
update => update,
exit => exit
.call(text => text.transition(t).remove()
.attr("y", 41))
)
.call(text => text.transition(t)
.attr("y", 17)
.attr("x", (d, i) => i * 17));
}
});
}