usage-drawing-tool
v1.1.6
Published
This tool is for drawing usage condition
Downloads
60
Readme
Usage drawing tool
This tool is for drawing usage condition
How to install
For JQuery
and original JS
Download js lib from npmjs
npm i usage-drawing-tool
add js/css to html
<link rel='stylesheet' href='assets/railroad-diagrams.css'>
<script type="text/javascript" src="/usage-drawing-tool.min.js"></script>
you can custom css style for your project
For TypeScript
such as Angular
Vue
React
Install
npm i usage-drawing-tool
Import
import * as UsageDrawingTool from 'usage-drawing-tool';
Run
UsageDrawingTool.analyzeCode(expression)
Example
// init
UsageDrawingTool.init({
category: {
E6_AF00: { enDesc: 'E6' },
E7_AF00: { enDesc: 'E7' },
AC00: { enDesc: 'INT COL' },
JD00: { enDesc: 'SIG PNL' },
JE00: { enDesc: 'SEAT MTL' }
},
data: {
E6_AF01: { category: 'E6_AF00', enDesc: 'G1.1' },
E6_AF02: { category: 'E6_AF00', enDesc: 'G1.2' },
E6_AF06: { category: 'E6_AF00', enDesc: 'G1.3' },
E6_AF07: { category: 'E6_AF00', enDesc: 'G1.F' },
E6_AF08: { category: 'E6_AF00', enDesc: 'G1.5' },
E6_AF09: { category: 'E6_AF00', enDesc: 'G1.6' },
E7_AF01: { category: 'E7_AF00', enDesc: 'G1.1' },
E7_AF02: { category: 'E7_AF00', enDesc: 'G1.2' },
E7_AF06: { category: 'E7_AF00', enDesc: 'G1.3' },
E7_AF07: { category: 'E7_AF00', enDesc: 'G1.F' },
E7_AF08: { category: 'E7_AF00', enDesc: 'G1.5' },
E7_AF09: { category: 'E7_AF00', enDesc: 'G1.6' },
AC02: { category: 'AC00', enDesc: 'HL GRY_INT BRN' },
JD02: { category: 'JD00', enDesc: 'SIG PNL' },
JE02: { category: 'JE00', enDesc: 'NAPPA' },
JE01: { category: 'JE00', enDesc: 'FABRIC' }
}
});
// analyze
var graph = UsageDrawingTool.analyzeCode('(E6_AF01||E6_AF02||E6_AF06||E6_AF07||E6_AF08||E6_AF09)&&JD02&&(JE01||JE02)||(E7_AF01||E7_AF02||E7_AF06||E7_AF07||E7_AF08||E7_AF09)');
How to display
// CASE1: Get HTML directly
var htmlCode = graph.toString();
// TODO set htmlCode as innerHtml to parent Element.
// CASE2: Append to Dom element
graph.addTo(domElement);
// CASE3: Get SVG element
var svgElement = graph.toSVG();
// TODO append svgElement to parent Element
Result
Release Note
V1.1.1
- Fix Bug: Exception when no operator in expression
V1.1.0
- Support group display by category
V1.0.7
- Original Version