Javascript 如何在谷歌地图上用d3.js绘制十六进制网格覆盖图

我试图找出如何使用d3.js在Google地图上绘制交互式十六进制网格，但我似乎找不到这个特定实现所需的文档

这是项目与混合输入（）的组合。我计划利用来自的一些十六进制网格信息

这里有两个重载（我认为）功能：

function d3init() {
  width = map.getDiv().offsetWidth;
  height = map.getDiv().offsetHeight;

  projection = d3.geo.equirectangular()
    .translate([0,0])
    .scale(57.29578)
    .precision(.1)

  context = new PolyLineContext();
  path = d3.geo.path().projection(projection).context(context);
  equator = {type: 'LineString', coordinates: [[-180,20],[-90,0], [0,-20], [90,0], [180,20] ] }

  render();
}

function render() {
  polyline.setOptions({
    strokeColor: 'red',
    strokeWeight: 2
  });
  context.setCurrent(polyline.getPath());
  path(equator);
}

我发现的大多数示例都使用SVG方法来绘制形状，但我希望有很多这样的六角体，因此canvas可能更适合此任务

---

我如何用十六进制网格覆盖地图？向叠加中添加几何图形的最佳方法是什么？我应该查看

赤道={键入：'LineString'，…

作为为六边形网格添加更多坐标的地方？

您需要使用d3.js来绘制六边形吗？可能需要使用d3进行画布渲染，而不是svg，因为它应该在硬件加速方面更好。感谢链接！！3年后，似乎仍然没有任何像样的解决方案回答这个问题。