ng-workflow-svg-js
Version:
[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.
58 lines (51 loc) • 1.48 kB
Markdown
# 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
~~~~
<ng-workflow-svg-js
[id] = "'some-id'"
[width] = "500"
[height] = "500"
[(entities)] = "entities"
[(lines)] = "lines"
[configuration] = "configuration"
></ng-workflow-svg-js>
~~~~
|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.