ng-workflow-svg-js
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
- Install the library via npm
npm install ng-workflow-svg-js
- Next you have to install the Peer Dependencies in the right version (see package.json)
- 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"
]
- 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.