An open API service indexing awesome lists of open source software.

https://github.com/thomaswruss/ng-workflow-svg-js

Angular Wrapper for workflow-svg.js
https://github.com/thomaswruss/ng-workflow-svg-js

angular component ng ngx workflow wrapper

Last synced: about 1 year ago
JSON representation

Angular Wrapper for workflow-svg.js

Awesome Lists containing this project

README

          

# ng-workflow-svg-js

[workflow-svg.js](https://github.com/thomaswruss/workflow-svg.js) is a library to display workflows as SVG. This library is an Angular Wrapper for it.

## How to use

~~~~

~~~~
|Attribute|Type|In-Param|Out-Param|
|---|---|---|---|
|id|string|✔|☐|
|width|number|✔|☐|
|height|number|✔|☐|
|entities|NgWorkflowSvgJsEntity[]|✔|✔|
|lines|NgWorkflowSvgJsLine[]|✔|✔|
|configuration|NgWorkflowSvgJsConfiguration|✔|☐|

## How to install

1. Install the library via npm
~~~~
npm install ng-workflow-svg-js
~~~~
2. Next you have to install the Peer Dependencies in the right version (see package.json)
3. Add the scripts in your angular.json
~~~~
"scripts": [
"./node_modules/@svgdotjs/svg.js/dist/svg.min.js",
"./node_modules/@svgdotjs/svg.draggable.js/dist/svg.draggable.min.js",
"./node_modules/workflow-svg.js/dist/workflow-svg.minified.js"
]
~~~~
4. Add the ng-workflow-svg-js module to your app
~~~~
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
NgWorkflowSvgJsModule // <== add the NgWorkflowSvgJsModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
~~~~
Now you can use the ng-workflow-svg-js component.