d3 v5在地图上放置大头针图像

Question

我正在使用d3渲染美国地图。我可以使用Long Lat使用svg的circle标签的cx和cy属性在地图上将圆定位为图钉。但是现在我想在地图上放置图像或html标签。问题是如何使用长纬度计算图像标签或div标签的位置。这是我的代码示例。

<circle
    key={marker.id}
    cx={ projection(props)([`${long}`, `${lat}`])[0] }
    cy={ projection(props)([`${long}`, `${lat}`])[1] }
    r={ 10 }
    fill="#E91E63"
    className="marker"
/>

和投影功能。

const projection = (props) => {
    return geoAlbersUsa()
      .scale(props.width)
      .translate([ props.width / 2, props.height / 2 ]);
}