# three-particle

> A particle plugin base on three.js

Latest version **0.0.7** (published 2019-04-19) · MIT license · 0 weekly downloads

## Install

```sh
npm install three-particle
pnpm add three-particle
yarn add three-particle
bun add three-particle
```

## Health

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

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.7 |
| Published | 2019-04-19 |
| First published | 2019-03-14 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 17 |
| Unpacked size | 7.1 MB |
| Known vulnerabilities | 0 (+4 in 2 direct dependencies) |
| Install scripts | no |
| GitHub stars | 13 |
| Author | GurifYuanin |
| Maintainers | gurif |

## Links

- npm: https://www.npmjs.com/package/three-particle
- Repository: https://github.com/GurifYuanin/three-particle
- Homepage: https://github.com/GurifYuanin/three-particle#readme
- Issues: https://github.com/GurifYuanin/three-particle/issues
- npm.io page: https://npm.io/package/three-particle

## Dependencies (17)

- [xss](https://npm.io/package/xss.md) ^1.0.6
- [three](https://npm.io/package/three.md) ^0.99.0
- [showdown](https://npm.io/package/showdown.md) ^1.9.0
- [@jsmini/is](https://npm.io/package/@jsmini/is.md) 0.4.0
- [@jsmini/url](https://npm.io/package/@jsmini/url.md) 0.1.0
- [@jsmini/guid](https://npm.io/package/@jsmini/guid.md) 0.6.0
- [@jsmini/load](https://npm.io/package/@jsmini/load.md) 0.1.0
- [@jsmini/type](https://npm.io/package/@jsmini/type.md) 0.4.0
- [@jsmini/clone](https://npm.io/package/@jsmini/clone.md) 0.3.0
- [@jsmini/event](https://npm.io/package/@jsmini/event.md) 0.5.1
- [@babel/runtime](https://npm.io/package/@babel/runtime.md) ^7.4.3
- [@jsmini/extend](https://npm.io/package/@jsmini/extend.md) 0.2.0
- [@jsmini/pubsub](https://npm.io/package/@jsmini/pubsub.md) 0.1.0
- [@babel/polyfill](https://npm.io/package/@babel/polyfill.md) ^7.4.3
- [@jsmini/console](https://npm.io/package/@jsmini/console.md) 0.6.0
- [@jsmini/inherits](https://npm.io/package/@jsmini/inherits.md) 0.5.0
- [@jsmini/querystring](https://npm.io/package/@jsmini/querystring.md) 0.1.0

## Recent versions

- 0.0.7 (latest) — 2019-04-19
- 0.0.6 — 2019-04-13
- 0.0.5 — 2019-04-10
- 0.0.4 — 2019-04-03
- 0.0.3 — 2019-03-17
- 0.0.2 — 2019-03-17
- 0.0.1 — 2019-03-14

## README

# [Three-particle](https://github.com/GurifYuanin/three-particle)
[![](https://img.shields.io/badge/Powered%20by-three%20particle-brightgreen.svg)](https://github.com/GurifYuanin/three-particle)
[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/GurifYuanin/three-particle/blob/master/LICENSE)
[![Build Status](https://travis-ci.org/GurifYuanin/three-particle.svg?branch=master)](https://travis-ci.org/GurifYuanin/three-particle)
[![npm](https://img.shields.io/badge/npm-6.9.0-orange.svg)](https://www.npmjs.com/package/three-particle)
[![NPM downloads](http://img.shields.io/npm/dm/three-particle.svg?style=flat-square)](http://www.npmtrends.com/three-particle)
[![Percentage of issues still open](http://isitmaintained.com/badge/open/GurifYuanin/three-particle.svg)](http://isitmaintained.com/project/GurifYuanin/three-particle "Percentage of issues still open")

A [three.js](https://github.com/mrdoob/three.js) based particle script to create particle system easily and efficiently.

## Compatibility
Unit tests guarantee support on the following environment:

| IE   | CH   | FF   | SF   | OP   | IOS  | Android   | Node  |
| ---- | ---- | ---- | ---- | ---- | ---- | ---- | ----- |
| 6+   | 29+  | 55+  | 9+   | 50+  | 9+   | 4+   | 4+    |

> Note: Compiling code depend on ES5, so you need import [es5-shim](http://github.com/es-shims/es5-shim/) to compatible with `IE6-8`, here is a [demo](./demo/demo-global.html)

## Directory
```
├── demo - Using demo
├── dist - Compiler output code
├── doc - Project documents
├── src - Source code directory
├── server - Start a local server when dev
├── test - Unit tests
├── CHANGELOG.md - Change log
└── TODO.md - Planned features
```

## Demo
You can view example on [Github page](https://gurifyuanin.github.io/three-particle/demo/) !

## Usage

Using npm, download and install the code. 

```bash
$ npm install --save three three-particle
```

For webpack or similar environment：

```js
import * as THREE from 'three'; // based lib
import * as TP from 'three-particle';

// same as three.js
// create renderer, scene, camera, etc...
const renderer = new THREE.WebGLRenderer();
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

// what you really need to do
// create particle system by three-particle
const emitter = new TP.ExplosionEmitter();
const sphere = new TP.Sphere();
emitter.addParticle(sphere);
scene.add(emitter);

(function render() {
    requestAnimationFrame(render);
    emitter.update(); // if not, particles will not be updated
    renderer.render(scene, camera);
})();
```

For commonjs environment:

```js
const THREE = require('three');
const TP = require('three-particle');
```

For browser environment:

```html
<!-- cdn -->
<script src="https://unpkg.com/three"></script>
<script src="https://unpkg.com/three-particle"></script>

<!-- local file -->
<script src="node_modules/three/build/three.min.js"></script>
<script src="node_modules/three-particle/dist/index.js"></script>
```

## Documents
+ [API Document](./doc/api.md)
+ [接口文档](./doc/api.zh-CN.md)
+ [HTML entry](https://gurifyuanin.github.io/three-particle/doc/index.html)

## Contribution Guide

How to switch `JS` and `TS`

- `srctype` and `scripts` in `package.json`
- `require` file of `test/test.js`
- `require` file of `test/browser/index.html`

For the first time to run, you need to install dependencies firstly.

```bash
$ npm install
```

To develop the project:
```bash
$ npm run dev
```

You can start up a local server to load some static resource (eg: font, img) when using font-loader or image-texture.
Then visit `localhost:1234` in your browser.
```bash
$ npm run serve
```

To build the project:

```bash
$ npm run build
```

To run unit tests:

```bash
$ npm test
```

> Note: The browser environment needs to be tested manually under ```test/browser```

Modify the version number in package.json, modify the version number in README.md, modify the CHANGELOG.md, and then release the new version.

```bash
$ npm run release
```

Publish the new version to NPM.

```bash
$ npm publish
```

### Warning
Please don't update npm package `rollup-plugin-typescript2`, or you will get an error.
```shell
[!] Error: Entry module cannot be external
```

## Contributors

[contributors](https://github.com/GurifYuanin/three-particle/graphs/contributors)

## Change Log
[CHANGELOG.md](./CHANGELOG.md)

## TODO
[TODO.md](./TODO.md)

## Current Users


## Relative links

- [typescript-library-template](https://github.com/jiumao-fe/typescript-library-template)
- [jslib-base](https://github.com/yanhaijing/jslib-base)

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