How to use h3-js - 10 common examples
To help you get started, we’ve selected a few h3-js examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
vasturiano / three-globe / src / layers / hexedPolygons.js View on Github 
const margin = Math.max(0, Math.min(1, +marginAccessor(d)));
const color = colorAccessor(d);
const opacity = colorAlpha(color);
const material = new THREE.MeshLambertMaterial({
color,
transparent: opacity < 1,
opacity,
side: THREE.DoubleSide,
depthWrite: true
});
const h3Idxs = [];
if (geoJson.type === 'Polygon') {
h3Idxs.push(...polyfill(geoJson.coordinates, h3Res, true));
} else if (geoJson.type === 'MultiPolygon') {
geoJson.coordinates
.forEach(coords => h3Idxs.push(...polyfill(coords, h3Res, true)));
} else {
console.warn(`Unsupported GeoJson geometry type: ${geoJson.type}. Skipping geometry...`);
}
threeDigest(h3Idxs.map(h3Idx => ({ h3Idx })), obj, {
idAccessor: d => d.h3Idx,
createObj: ({ h3Idx }) => {
const obj = new THREE.Mesh();
obj.__hexCenter = h3ToGeo(h3Idx);
obj.__hexGeoJson = h3ToGeoBoundary(h3Idx, true);
// stitch longitudes at the anti-meridian
const centerLng = obj.__hexCenter[1];if (timestamp.diff(current) <= 0) {
lastAvailable = state;
}
}
});
if (lastAvailable) {
// onstreet hex bins
var bin = h3.geoToH3(
lastAvailable.event_location.geometry.coordinates[1],
lastAvailable.event_location.geometry.coordinates[0],
Z
);
// store geo
var geo = turf.polygon([h3.h3ToGeoBoundary(bin, true)], {
bin: bin
});
stats.geometry.bins[bin] = geo;
// bootstrap bin
if (!stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")]) {
stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")] = {};
}
if (
!stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")][bin]
) {
stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")][
bin
] = 1;
} else {
stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")][bin]++;if (timestamp.diff(current) <= 0) {
lastAvailable = state;
}
}
});
if (lastAvailable) {
// availability hex bins
var bin = h3.geoToH3(
lastAvailable.event_location.geometry.coordinates[1],
lastAvailable.event_location.geometry.coordinates[0],
Z
);
// store geo
var geo = turf.polygon([h3.h3ToGeoBoundary(bin, true)], {
bin: bin
});
stats.geometry.bins[bin] = geo;
// bootstrap bin
if (
!stats.availability.bins.minute[current.format(baseDay + "-HH-mm")]
) {
stats.availability.bins.minute[
current.format(baseDay + "-HH-mm")
] = {};
}
if (
!stats.availability.bins.minute[current.format(baseDay + "-HH-mm")][
bin
]function h3ToPolygon(hexId, coverage = 1, flatten) {
const vertices = h3ToGeoBoundary(hexId, true);
if (coverage !== 1) {
// scale and normalize vertices w.r.t to center
scalePolygon(hexId, vertices, coverage);
} else {
// normalize w.r.t to start vertex
normalizeLongitudes(vertices);
}
if (flatten) {
const positions = new Float64Array(vertices.length * 2);
let i = 0;
for (const pt of vertices) {
positions[i++] = pt[0];
positions[i++] = pt[1];
}export function getVertices({id}) {
// always reverse it
return h3ToGeoBoundary(id, true);
}Z
);
var b = h3.geoToH3(
trip.route.features[trip.route.features.length - 1].geometry
.coordinates[1],
trip.route.features[trip.route.features.length - 1].geometry
.coordinates[0],
Z
);
// store pair geometry
var pair = turf.lineString(
[
turf.centroid(turf.polygon([h3.h3ToGeoBoundary(a, true)])).geometry
.coordinates,
turf.centroid(turf.polygon([h3.h3ToGeoBoundary(b, true)])).geometry
.coordinates
],
{ pair: a + ">" + b }
);
stats.geometry.pairs[pair.properties.pair] = pair;
var timeBins = getTimeBins(reportDay, trip.start_time);
// populate time bins
if (!stats.flows.pairs.day[timeBins.day]) {
stats.flows.pairs.day[timeBins.day] = {};
}
if (!stats.flows.pairs.hour[timeBins.hour]) {
stats.flows.pairs.hour[timeBins.hour] = {};
}
if (!stats.flows.pairs.minute[timeBins.minute]) {
stats.flows.pairs.minute[timeBins.minute] = {};trip.route.features[0].geometry.coordinates[1],
trip.route.features[0].geometry.coordinates[0],
Z
);
var b = h3.geoToH3(
trip.route.features[trip.route.features.length - 1].geometry
.coordinates[1],
trip.route.features[trip.route.features.length - 1].geometry
.coordinates[0],
Z
);
// store pair geometry
var pair = turf.lineString(
[
turf.centroid(turf.polygon([h3.h3ToGeoBoundary(a, true)])).geometry
.coordinates,
turf.centroid(turf.polygon([h3.h3ToGeoBoundary(b, true)])).geometry
.coordinates
],
{ pair: a + ">" + b }
);
stats.geometry.pairs[pair.properties.pair] = pair;
var timeBins = getTimeBins(reportDay, trip.start_time);
// populate time bins
if (!stats.flows.pairs.day[timeBins.day]) {
stats.flows.pairs.day[timeBins.day] = {};
}
if (!stats.flows.pairs.hour[timeBins.hour]) {
stats.flows.pairs.hour[timeBins.hour] = {};
}function h3ToFeature(hexAddress, properties = {}) {
// Wrap in an array for a single-loop polygon
const coordinates = [h3.h3ToGeoBoundary(hexAddress, true)];
return {
type: FEATURE,
id: hexAddress,
properties,
geometry: {
type: POLYGON,
coordinates
}
};
}[trip.route.features[0]].forEach(ping => {
var bin = h3.geoToH3(
ping.geometry.coordinates[1],
ping.geometry.coordinates[0],
Z
);
bins.add(bin);
});
// store bin geometrystates[vehicle_id].forEach(state => {
if (
state.event_type === "available" ||
state.event_type === "unavailable"
) {
var timestamp = moment(state.event_time, "X");
if (timestamp.diff(current) <= 0) {
lastAvailable = state;
}
}
});
if (lastAvailable) {
// onstreet hex bins
var bin = h3.geoToH3(
lastAvailable.event_location.geometry.coordinates[1],
lastAvailable.event_location.geometry.coordinates[0],
Z
);
// store geo
var geo = turf.polygon([h3.h3ToGeoBoundary(bin, true)], {
bin: bin
});
stats.geometry.bins[bin] = geo;
// bootstrap bin
if (!stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")]) {
stats.onstreet.bins.minute[current.format(baseDay + "-HH-mm")] = {};
}
if (h3-js
Pure-Javascript version of the H3 library, a hexagon-based geographic grid system
