function initTooltips(dependencies) {
mdcStyles();
document.querySelectorAll(`[data-mdc-tooltip]`)
.forEach((anchorEl) => {
const anchorSelection = d3.select(anchorEl);
const id = DOM.uid("tooltip").id;
const tooltipId = anchorSelection.attr("aria-describedby");
document.getElementById(tooltipId)
?.remove()
const tooltipEl = htl.html`<div id="${id}" class="mdc-tooltip" role="tooltip" aria-hidden="true">
<div class="mdc-tooltip__surface mdc-tooltip__surface-animation">
<span class="mdc-tooltip__label">${anchorSelection.attr("data-mdc-tooltip")}<span>
</div>
</div>`;
document.body.appendChild(tooltipEl);
anchorSelection
.attr("aria-describedby", id);
const tooltip = new mdc.tooltip.MDCTooltip(tooltipEl);
tooltip.setTooltipPosition({ yPos: 1 })
})
}