Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 | import * as React from 'react'; import * as ReactDOM from 'react-dom'; import registerServiceWorker from './registerServiceWorker'; import './index.css'; import { DiagramEngine, DefaultNodeFactory, DefaultLinkFactory, DiagramModel, DefaultNodeModel, LinkModel, DefaultPortModel, DiagramWidget } from 'storm-react-diagrams'; //1) setup the diagram engine var engine = new DiagramEngine(); engine.registerNodeFactory(new DefaultNodeFactory()); engine.registerLinkFactory(new DefaultLinkFactory()); //2) setup the diagram model var model = new DiagramModel(); //3-A) create a default node var node1 = new DefaultNodeModel('Node 1', 'rgb(0,192,255)'); var port1 = node1.addPort(new DefaultPortModel(false, 'out-1', 'Out')); node1.x = 100; node1.y = 100; //3-B) create another default node var node2 = new DefaultNodeModel('Node 2', 'rgb(192,255,0)'); var port2 = node2.addPort(new DefaultPortModel(true, 'in-1', 'IN')); node2.x = 400; node2.y = 100; //3-C) link the 2 nodes together var link1 = new LinkModel(); link1.setSourcePort(port1); link1.setTargetPort(port2); //4) add the models to the root graph model.addNode(node1); model.addNode(node2); model.addLink(link1); //5) load model into engine engine.setDiagramModel(model); ReactDOM.render(React.createElement(DiagramWidget, { diagramEngine: engine }), document.getElementById('root')); registerServiceWorker(); //# sourceMappingURL=index.js.map |