Quiero colocar un div en una ubicación exacta en la página, a través de d3.js

Para eso, uso

 let p = svg.createSVGPoint(); px = 0; py = event_desc_pos_y; let pt = p.matrixTransform(p.getScreenCTM()); let event_desc_div = d3.select('#event_description_div') .style('top', pt.y + 'px') .style('left', pt.x + 'px') .style('width', width + 'px');

donde tambien tengo

 #event_description_div { position:absolute; top: 50px; left:50px; overflow-y: scroll; height: 100px; }

sin embargo, cuando me he desplazado hacia abajo en la página, este código parece colocar este div fuera de lugar.

No estoy seguro de lo que está haciendo, ya que no parece que lo coloque dentro de la página en términos absolutos, pero tampoco relativamente en la página vista (la posición sube en la página a medida que me desplazo hacia abajo)

pt.y y pl.x no cambian.

En cualquier caso, no funciona. La ubicación depende en gran medida del desplazamiento.

¿Cómo puedo colocar el div siempre exactamente en el mismo lugar, independientemente de si la página se ha desplazado o no?