d3-polygon

What is d3-polygon?

The d3-polygon npm package is a part of the D3.js library that provides utilities for working with polygons. It includes functions for calculating the area, centroid, and perimeter of polygons, as well as for clipping and hull generation.

What are d3-polygon's main functionalities?

Polygon Area Calculation

This feature allows you to calculate the area of a polygon. The code sample demonstrates how to calculate the area of a rectangle with vertices at (0,0), (4,0), (4,3), and (0,3).

const d3 = require('d3-polygon');
const polygon = [[0, 0], [4, 0], [4, 3], [0, 3]];
const area = d3.polygonArea(polygon);
console.log(area); // Output: 12

Polygon Centroid Calculation

This feature allows you to calculate the centroid (geometric center) of a polygon. The code sample demonstrates how to find the centroid of a rectangle.

const d3 = require('d3-polygon');
const polygon = [[0, 0], [4, 0], [4, 3], [0, 3]];
const centroid = d3.polygonCentroid(polygon);
console.log(centroid); // Output: [2, 1.5]

Polygon Hull Generation

This feature allows you to generate the convex hull of a set of points. The code sample demonstrates how to find the convex hull of a set of points that includes the vertices of a rectangle and an additional point inside the rectangle.

const d3 = require('d3-polygon');
const points = [[0, 0], [4, 0], [4, 3], [0, 3], [2, 1.5]];
const hull = d3.polygonHull(points);
console.log(hull); // Output: [[0, 0], [4, 0], [4, 3], [0, 3]]

Other packages similar to d3-polygon

turf

Turf is a powerful geospatial analysis library for JavaScript. It provides a wide range of functions for working with geometries, including polygons. Compared to d3-polygon, Turf offers more comprehensive geospatial analysis capabilities, such as buffering, intersecting, and measuring distances between geometries.

polygon-clipping

Polygon Clipping is a library specifically designed for performing boolean operations on polygons, such as union, intersection, and difference. While d3-polygon provides basic polygon utilities, Polygon Clipping focuses on more advanced operations for manipulating polygon shapes.

earcut

Earcut is a fast and simple library for triangulating polygons. It is particularly useful for rendering polygons in WebGL. Compared to d3-polygon, Earcut is specialized for converting polygons into triangles, which can be useful for graphics and visualization applications.

README

d3-polygon

This module provides a few basic geometric operations for two-dimensional polygons. Each polygon is represented as an array of two-element arrays [​[x1, y1], [x2, y2], …], and may either be closed (wherein the first and last point are the same) or open (wherein they are not). Typically polygons are in counterclockwise order, assuming a coordinate system where the origin ⟨0,0⟩ is in the top-left corner.

Installing

If you use npm, npm install d3-polygon. You can also download the latest release on GitHub. For vanilla HTML in modern browsers, import d3-polygon from Skypack:

<script type="module">

import {polygonHull} from "https://cdn.skypack.dev/d3-polygon@3";

const hull = polygonHull(points);

</script>

For legacy environments, you can load d3-polygon’s UMD bundle from an npm-based CDN such as jsDelivr; a d3 global is exported:

<script src="https://cdn.jsdelivr.net/npm/d3-polygon@3"></script>
<script>

const hull = d3.polygonHull(points);

</script>

API Reference

# d3.polygonArea(polygon) <>

Returns the signed area of the specified polygon. If the vertices of the polygon are in counterclockwise order (assuming a coordinate system where the origin ⟨0,0⟩ is in the top-left corner), the returned area is positive; otherwise it is negative, or zero.

# d3.polygonCentroid(polygon) <>

Returns the centroid of the specified polygon.

# d3.polygonHull(points) <>

Returns the convex hull of the specified points using Andrew’s monotone chain algorithm. The returned hull is represented as an array containing a subset of the input points arranged in counterclockwise order. Returns null if points has fewer than three elements.

# d3.polygonContains(polygon, point) <>

Returns true if and only if the specified point is inside the specified polygon.

# d3.polygonLength(polygon) <>

Returns the length of the perimeter of the specified polygon.