# jnline

> Generate Random Svg Lines and Animate it

Latest version **1.0.7** (published 2017-09-22) · GPL-3.0 license · 0 weekly downloads

## Install

```sh
npm install jnline
pnpm add jnline
yarn add jnline
bun add jnline
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2017-09-22 |
| First published | 2017-09-19 |
| Weekly downloads | 0 |
| License | GPL-3.0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 18 |
| Author | Jonas Nickel |
| Maintainers | caiptain_keller |
| Keywords | SVG, Animation, jQuery, lines, canvas |

## Links

- npm: https://www.npmjs.com/package/jnline
- Repository: https://github.com/jonasnickel/jnLine
- Homepage: https://github.com/jonasnickel/jnLine#readme
- Issues: https://github.com/jonasnickel/jnLine/issues
- npm.io page: https://npm.io/package/jnline

## Dependencies (1)

- [jquery](https://npm.io/package/jquery.md) ^3.2.1

## Alternatives

- [gamedig](https://npm.io/package/gamedig.md) — 29.3K weekly downloads
- [join-monster](https://npm.io/package/join-monster.md) — 12.8K weekly downloads
- [masked](https://npm.io/package/masked.md) — 5.5K weekly downloads
- [@comunica/actor-query-process-explain-logical](https://npm.io/package/@comunica/actor-query-process-explain-logical.md) — 4.7K weekly downloads
- [@veracity/vui](https://npm.io/package/@veracity/vui.md) — 4.6K weekly downloads

## Recent versions

- 1.0.7 (latest) — 2017-09-22
- 1.0.5 — 2017-09-19

## README

JnLine.js
===========

Generates random svg Lines

## Installation

Download package and include `jquery.jnLine.min.js` in your document after including jQuery.
You can use NPM

```javascript
npm install jnline
```

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="/path/to/jquery.jnLine.min.js"></script>
```

## Usage

You need an empty SVG Element in your HTML
```html
<svg id="jnLine" xmlns="http://www.w3.org/2000/svg"></svg>
```

### Via JavaScript

To call the jnLine plugin, select your target element with jQuery and do the following:

```javascript
$('#jnLine').jnLine();
```

## Options

<table class="table table-bordered table-striped">
	<thead>
		<tr>
			<th style="width: 100px;">Name</th>
			<th style="width: 100px;">type</th>
			<th style="width: 50px;">default</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>svgId</td>
			<td>string</td>
			<td>null</td>
		</tr>
		<tr>
			<td>width</td>
			<td>number</td>
			<td>SvgWidth</td>
		</tr>
		<tr>
			<td>height</td>
			<td>number</td>
			<td>SvgHeight</td>
		</tr>
		<tr>
			<td>strokeColor</td>
			<td>string</td>
			<td>#000</td>
		</tr>
		<tr>
			<td>strokeWidth</td>
			<td>number</td>
			<td>2</td>
		</tr>
		<tr>
			<td>animateTime</td>
			<td>number</td>
			<td>1000</td>
		</tr>
		<tr>
			<td>interval</td>
			<td>number</td>
			<td>600</td>
		</tr>
		<tr>
			<td>fadeOut</td>
			<td>number</td>
			<td>800</td>
		</tr>
		<tr>
			<td>lifeTime</td>
			<td>number</td>
			<td>2000</td>
		</tr>
		<tr>
			<td>easing</td>
			<td>string</td>
			<td>swing</td>
		</tr>
		<tr>
			<td>leftRight</td>
			<td>boolean</td>
			<td>true</td>
		</tr>
		<tr>
		    <td>animationTimeRange</td>
		    <td>array Number</td>
		    <td>[&lt;number&gt;, &lt;number&gt;]</td>
		</tr>
	</tbody>
</table>

## Functions

To Destroy the plugin

```javascript
$('#jnLine').jnLine.destroy();
```

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