# svg-path-bbox

> Compute bounding boxes of SVG paths.

Latest version **2.1.0** (published 2024-09-03) · BSD-3-Clause license · 0 weekly downloads

## Install

```sh
npm install svg-path-bbox
pnpm add svg-path-bbox
yarn add svg-path-bbox
bun add svg-path-bbox
```

Provides the command `svg-path-bbox`.

## Health

**Score 40/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 2.1.0 |
| Published | 2024-09-03 |
| First published | 2020-05-16 |
| Weekly downloads | 0 |
| License | BSD-3-Clause |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Node | >=6.17.1 |
| Dependencies | 1 |
| Unpacked size | 24.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 64 |
| Author | Álvaro Mondéjar Rubio |
| Maintainers | mondeja |
| Keywords | svg, path, bbox |

## Links

- npm: https://www.npmjs.com/package/svg-path-bbox
- Repository: https://github.com/mondeja/svg-path-bbox
- Homepage: https://github.com/mondeja/svg-path-bbox#readme
- Issues: https://github.com/mondeja/svg-path-bbox/issues
- npm.io page: https://npm.io/package/svg-path-bbox

## Dependencies (1)

- [svgpath](https://npm.io/package/svgpath.md) ^2.6.0

## Alternatives

- [base64url](https://npm.io/package/base64url.md) — 6.1M weekly downloads
- [get-installed-path](https://npm.io/package/get-installed-path.md) — 502.9K weekly downloads
- [@uppy/url](https://npm.io/package/@uppy/url.md) — 185.8K weekly downloads
- [@d3fc/d3fc-shape](https://npm.io/package/@d3fc/d3fc-shape.md) — 16.2K weekly downloads
- [localizer](https://npm.io/package/localizer.md) — 226 weekly downloads

## Recent versions

- 2.1.0 (latest) — 2024-09-03
- 2.0.0 — 2024-06-06
- 1.2.6 — 2024-03-14
- 1.2.5 — 2024-03-13
- 1.2.4 — 2023-02-09
- 1.2.3 — 2022-12-23
- 1.2.2 — 2022-05-26
- 1.2.1 — 2022-05-12
- 1.2.0 — 2022-05-07
- 1.1.1 — 2022-05-06
- 1.1.0 — 2022-05-06
- 1.0.2 — 2022-01-11
- 1.0.1 — 2021-06-21
- 1.0.0 — 2021-06-03
- 0.2.0 — 2020-12-22
- … 51 more at https://npm.io/package/svg-path-bbox/versions

## README

# 📦 svg-path-bbox

[![NPM version][npm-version-image]][npm-link]
[![License][license-image]][license-link]
[![NodeJS versions][npm-versions-image]][npm-link]

SVG paths bounding box calculator.

## Status

[![Tests][tests-image]][tests-link]
[![Coverage status][coveralls-image]][coveralls-link]

## Install

```sh
npm install svg-path-bbox
```

## Documentation

### Usage

```javascript
> import { svgPathBbox } from "svg-path-bbox";
> svgPathBbox("M5 10l2 3z")
[ 5, 10, 7, 13 ]
> svgPathBbox("M5 10c3 0 3 3 0 3z")
[ 5, 10, 7.25, 13 ]
```

Returned bounding box is an array made up like `viewBox` SVG attributes `[x0, y0, x1, y1]` of unrounded values:

<p align="center">
  <img width="256" height="256" src="https://raw.githubusercontent.com/mondeja/svg-path-bbox/master/svg-path-bbox.svg">
</p>

### Command line

```bash
$ svg-path-bbox "M5 10c3 0 3 3 0 3z"
5 10 7.25 13

$ svg-path-bbox "M5 10c3 0 3 3 0 3z" "M2 8m5 5z"
5 10 7.25 13
2 8 7 13
```

### Typescript usage

```typescript
import { svgPathBbox } from "svg-path-bbox";
import type { BBox } from "svg-path-bbox";

const cases: [string, BBox][] = [["M0 0H3V6Z", [0, 0, 3, 6]]];
console.log(svgPathBbox(cases[0]));
```

### Reference

<a name="svgPathBbox" href="#svgPathBbox">#</a> **svgPathBbox**(d : _string_ | typeof import('svgpath')) ⇒ [minX: _number_, minY: _number_, maxX: _number_, maxY: _number_]

Computes the bounding box of SVG path following the [SVG 1.1 specification](https://www.w3.org/TR/SVG/paths.html).

- **d** (_string_ | typeof import('svgpath')) SVG path. Can be a string or a `SvgPath` interface from [svgpath].

## Thanks to

- [simple-icons/simple-icons](https://github.com/simple-icons/simple-icons) for reference dataset.
- [kpym/SVGPathy](https://github.com/kpym/SVGPathy) for reference implementation.
- [icons8/svg-path-bounding-box](https://github.com/icons8/svg-path-bounding-box) because [their bug](https://github.com/icons8/svg-path-bounding-box/issues/3) has been the source of this library.
- [mathandy/svgpathtools](https://github.com/mathandy/svgpathtools/) for reference implementation to compare with.
- [svgpath](https://www.npmjs.com/package/svgpath) as is used internally by svg-path-bbox to parse and transform paths before compute bounding boxes.

[npm-link]: https://www.npmjs.com/package/svg-path-bbox
[npm-version-image]: https://img.shields.io/npm/v/svg-path-bbox
[tests-image]: https://img.shields.io/github/actions/workflow/status/mondeja/svg-path-bbox/ci.yml?branch=master&logo=github&label=tests
[tests-link]: https://github.com/mondeja/svg-path-bbox/actions?query=workflow%3ATest
[coveralls-image]: https://coveralls.io/repos/github/mondeja/svg-path-bbox/badge.svg?branch=master
[coveralls-link]: https://coveralls.io/github/mondeja/svg-path-bbox?branch=master
[license-image]: https://img.shields.io/npm/l/svg-path-bbox?color=brightgreen
[license-link]: https://github.com/mondeja/svg-path-bbox/blob/master/LICENSE
[npm-versions-image]: https://img.shields.io/node/v/svg-path-bbox
[svgpath]: https://www.npmjs.com/package/svgpath

---
_Source: https://npm.io/package/svg-path-bbox · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._