谷歌地图和D3.js

Question

我已经开始研究以前的项目，但是我遇到了一个绊脚石，用新数据复制它，这是一个难题。

这些点正在渲染但不在正确的位置。此外，当您放大和缩小点数更改位置时 - 我已经双重检查了long和lat是否相同。

我认为问题出在转换函数中：

函数变换（d）{

          d = new google.maps.LatLng(+d.Latitude, +d.Longitude);
          d = projection.fromLatLngToDivPixel(d);
          return d3.select(this)
              .style("left", (d.x - padding) + "px")
              .style("top", (d.y - padding) + "px");

}

fromLatLngToDivPixel（d）将点错误放置还是覆盖左侧和顶部样式的东西？任何帮助非常感谢。这是'还没有'＆＃39;工作示例 - 代码在gist.github.com上。

https://bl.ocks.org/BMPMS/36dfbe319f6a6f4cfb56205e95687024

Answer 1

P.P.S我已经解决了。 CSS，愚蠢的我不要猜。所需的CSS如下 - 卫生是每个单独层的类：

 .hygiene, .hygiene svg {position: absolute;}

 .hygiene svg {
    width: 60px;
    height: 60px;
    padding-right: 100px;
    font: 10px sans-serif;
}

.hygiene circle {
   fill: #DC143C;
   stroke: grey;
   stroke-width: 0.5px;
}