# @jniac/three-point-text-helper

> Displaying point text in THREE JS.

Latest version **1.0.10** (published 2024-05-28) · ISC license · 0 weekly downloads

## Install

```sh
npm install @jniac/three-point-text-helper
pnpm add @jniac/three-point-text-helper
yarn add @jniac/three-point-text-helper
bun add @jniac/three-point-text-helper
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2024-05-28 |
| First published | 2021-01-10 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 274.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 77 |
| Author | Joseph Merdrignac |
| Maintainers | jniac |
| Keywords | threejs |

## Links

- npm: https://www.npmjs.com/package/@jniac/three-point-text-helper
- Repository: https://github.com/jniac/three-point-text-helper
- Homepage: https://github.com/jniac/three-point-text-helper#readme
- Issues: https://github.com/jniac/three-point-text-helper/issues
- npm.io page: https://npm.io/package/@jniac/three-point-text-helper

## Recent versions

- 1.0.10 (latest) — 2024-05-28
- 1.0.8 — 2022-02-11
- 1.0.7 — 2022-02-09
- 1.0.6 — 2022-02-09
- 1.0.5 — 2022-02-08
- 1.0.2 — 2021-01-11
- 1.0.1 — 2021-01-11
- 1.0.0 — 2021-01-10

## README

# Point Text Helper
"Point Text" Helper for ThreeJS

Thousand of tiny texts (labels) in one draw call. 

<a href="https://jniac.github.io/three-point-text-helper/tests/examples-vanilla/stress/">
<p align="center">
  <img src="screenshots/vanilla-stress-2.jpg">
<p>
<p align="center">
  Stress test with "vanilla" js (module).
  31 436 texts.
</p>
</a>

## Demos
- [triangle](https://jniac.github.io/three-point-text-helper/tests/examples-vanilla/triangle/)
- [stress](https://jniac.github.io/three-point-text-helper/tests/examples-vanilla/stress/)
- [effect-composer](https://jniac.github.io/three-point-text-helper/tests/examples-vanilla/effect-composer/)
- [blending](https://jniac.github.io/three-point-text-helper/tests/examples-vanilla/blending/)

## Install

NPM:
```
npm i @jniac/three-point-text-helper
```

Or plain JS, using github pages hosting:
```javascript
import { PointTextHelper } from 'https://jniac.github.io/three-point-text-helper/dist/PointTextHelper.three.js'
```


## Usage

```javascript
import * as THREE from 'three'
import { PointTextHelper } from '@jniac/three-point-text-helper'

//- snip -//

const pth = new PointTextHelper({ charMax:10 })
mesh.add(pth)

// display some text
pth.display({ text:'hello!',  color:'cyan' })
pth.display({ text:'top',     color:'cyan', size:.5, position:new THREE.Vector3(0, 1, 0) })
pth.display({ text:'bottom',  color:'cyan', size:.5, position:{ x:0, y:-1, z:0 } })

// or, from a mesh...
const mesh = new THREE.Mesh(
  new THREE.IcosahedronGeometry(1, 0),
  new THREE.MeshBasicMaterial({ color:'cyan', wireframe:true }),
)
scene.add(mesh)

// ...display an array of vertices:
pth.displayVertices(mesh.geometry.vertices)

// ...or a "position" buffer:
// (be aware that in buffer geometries, vertices are most often duplicated)
const geometry = new THREE.SphereBufferGeometry(1.4, 12, 24)
pth.displayVertices(geometry.getAttribute('position').array, {
  color: '#fc9',
  size: .3,
  format: index => `#${index}`,
})
```

## "dev" mode & examples
from a local repository, 2 process:
- run the library itself + static server
```shell
npm run dev
```
It will watch over any changes into the src folder, and re-build if any.
http://localhost:8000

For the "vanilla" js examples, this is enough:
http://localhost:8000/tests/examples-vanilla/triangle/

- but for the webpack examples, one may start the webpack service:
```shell
npm run examples-webpack
```

## Build
```shell
npx rollup -c
```

---
_Source: https://npm.io/package/@jniac/three-point-text-helper · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._