question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Help determining hexagon size/area/vertex-coordinates at different latitudes on a HexagonLayer

See original GitHub issue

I am trying to determine the area of each hexagon when hovered used within the HexagonLayer.

I can approximate the area of a hexagon if I know the either the radius, apothem, side length, or hexagon vertices in WGS84 coordinates. The layer accepts a radius property, in meters, but the resulting hexagons overlayed on the map are equally sized despite their latitude, so their radii cannot technically be the same number of meters as the value passed into the ‘radius’ property on the layer.

For example, a hexagon over the equator will have a much larger surface area than a hexagon of the same visual size projected over Greenland.

I inspected the payload to the onHover() method provided to the HexagonLayer properties, but am unable to find any reference to the hexagon vertices or the radius adjusted to the latitude.

Is it possible to use the projection to derive the actual radius in meters given the original radius and the hexagon’s latitude and longitude?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6

github_iconTop GitHub Comments

1reaction
Pessimistresscommented, Sep 28, 2020

Under the hood, hexagons are generated in the common space (“Web Mercator units”). You can find out this radius as follows:

  const hexagonLayer = info.layer;
  const [columnLayer] = info.layer.getSubLayers();
  const radius = columnLayer.props.radius;
  const center = columnLayer.props.data[info.index].position;
  const {viewport} = info.layer.context;

  // The "common" radius (this is a constant)
  const radiusCommon = radius * viewport.getDistanceScales().unitsPerMeter[0];

  // The meter radius at any arbitrary position
  const radiusAtCenter = radiusCommon / viewport.getDistanceScales(center).unitsPerMeter[0];

  // Calculate area
0reactions
SterlingMcCallcommented, Sep 28, 2020

@Pessimistress Thank you very much for the explanation!

Read more comments on GitHub >

github_iconTop Results From Across the Web

HexagonLayer - deck.gl
The HexagonLayer aggregates data into a hexagon-based heatmap. The color and height of a hexagon are determined based on the objects it contains....
Read more >
deck.gl - Get resulting hex data from Hexagon layer in h3
The H3HexagonLayer uses H3, and takes H3 indexes as input. I don't think Deck.gl has a layer (yet) that bins lat/lng to H3...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found