https://github.com/nextlevelshit/spline-generator
https://github.com/nextlevelshit/spline-generator
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/nextlevelshit/spline-generator
- Owner: nextlevelshit
- License: apache-2.0
- Created: 2019-02-18T10:12:10.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2020-09-07T21:40:56.000Z (almost 6 years ago)
- Last Synced: 2024-11-16T16:52:05.096Z (over 1 year ago)
- Language: TypeScript
- Size: 443 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
Spline Generator
---
# Getting started
## 1) Add dependency to your project
```bash
# npm
npm install nls-spline-generator --save
# yarn
yarn add nls-spline-generator
```
## 2) Import module to your Angular application
```ts
// app.module.ts (default filename)
import { NlsSplineGeneratoreModule } from 'nls-spline-generator';
@NgModule({
declarations: [
// ...
],
imports: [
// ...
NlsSplineGeneratoreModule
],
providers: [
// ...
],
bootstrap: [
// ...
]
})
export class AppModule { }
```
## 4) Implement directive in your template
Past in the configuration and set animation to `true` or `false` (default is `false`):
```html
```
## Usage only
```ts
// models/config.model.ts
/**
* The Configuration stands for incoming parameters from outside
* to adjust the outcoming graphs.
*/
export interface Config {
/**
* Amount of orientation points, excl. entry and vector points
*/
points?: number;
/**
* Points distributation factor depending on canvas size
*/
overshoot?: number;
/**
* Amount of graphs
*/
graphs?: number;
/**
* Amount of splines each graph
*/
splines?: number;
/**
* Directional vectors coming next after entry points.
* Starting as well ending points of graph drawn on canvs.
* Enters the canvas (in)
* Leaves the canvas (off)
*/
vector?: {
in?: {
/**
* Vector direction set by part of tau. Examples:
* 0 up, 0.25 right, 0.5 bottom, 0.75 left
*/
direction: number;
/**
* Margin between canvas border and first graph curve (px)
*/
margin: number;
/**
* Percentage of canvas height or width
*/
tension: number;
},
out?: {
/**
* Vector direction set by part of tau. Examples:
* 0 up, 0.25 right, 0.5 bottom, 0.75 left
*/
direction: number;
/**
* Margin between canvas border and first graph curve (px)
*/
margin: number;
/**
* Percentage of canvas height or width
*/
tension: number;
}
};
/**
* Configuration for Margins for Entrie Points, Splines and the Canvas at all.
*/
margin?: {
/**
* Margin between entry points of graphs
*/
entry?: number;
/**
* Margin between splines of graphs
*/
spline?: number;
canvas?: {
/**
* Horizontal margin between entry points and canvas boundries (px)
*/
x?: number;
/**
* Vertical margin between entry points and canvas boundries (px)
*/
y?: number;
}
};
/**
* Configuration of spline strokes
*/
stroke?: {
/**
* Spline stroke width in pixel
*/
width: number;
/**
* Spline stroke color in hexadecimal, rgb, etc.
*/
colors: string[];
};
/**
* Background color of canvas (default transprent)
*/
background?: string;
/**
* Configuration for Animation
*/
animation?: {
enabled?: boolean;
frequency?: number;
/**
* Amplitude of noise generated animation pathes
*/
amplitude?: number;
/**
* Radius of circular noise generated pathes
*/
radius?: number;
/**
* Ticks per one animation cycle
*/
ticks?: number;
};
/**
* Enable debug mode to draw all helpers like
* points etc.
*/
debug?: boolean;
}
```
## Active Development (Advanced)
### Rquirements
- Node.js
- Angular CLI
### NPM Scripts
| command | description |
|------------------|--------------------------------------------------------------------|
| `npm run start` | start development server on `http://localhost:4200/` |
| `npm run build` | build production application and save to `./dist` |
| `npm run build:library` | build node module and save to `./dist/nls-spline-generator` |
| `npm run library:files` | copy `README.md` and `LICENSE` to library directory |
### Version Release
#### 1. Bumping new version of main application
```bash
npm version major|minor|patch -m "RELEASE MESSAGE"
```
#### 2. Synchronizing versions
Synchronize the version of `./projects/nls-spline-generator/package.json` with the main application `./package.json`.
#### 3. Copying files
Copy `README.md` and `LICENSE` from main application to library.
```bash
npm run library:files
```
#### 4. Building library
```bash
npm run build:library
```
#### 5. Publishing to npm
```bash
cd dist/nls-spline-generator
npm publish
cd ../..
```
#### 6. Push changes to repository
```bash
git push
git push --tags
```
### Semantic Versioning
**Any release or tag must use [Semantic Versioning](//semver.org/).**
Given a version number `MAJOR.MINOR.PATCH`, increment the:
1. `MAJOR` version when you make incompatible API changes,
1. `MINOR` version when you add functionality in a backwards-compatible manner, and
1. `PATCH` version when you make backwards-compatible bug fixes.
*Additional labels for pre-release and build metadata are available as extensions to the MAJOR.MINOR.PATCH format.*
## Contributors
- Author and Realisation [Michael Czechowski](//github.com/nextlevelshit)
- Consultant [Martin Maga](//github.com/qualiacode)
- Idea and Concept [Bernhard Kinzler](//b612-design.de)
## License
> pending