Topic: Current flow Diagram App

[Jeff H]

Needing a program to simulate a distribution loop system.

Program will show the current flow by turning switches on and off, and very simple graphics of switches and colored lines is all that is needed.
Any suggestions on what technology or libraries would be good to use for this.
I am thinking it would be much easier to do as web app.

Here is a simple example of what it would be.
User can click on switch to open or close it.
User clicks W1(highlighted in yellow) and it opens then clicks on W2 to close it which will cause the two feeders on W3 and W4 to change from green to red

[Keith Brown]

If your looking to learn some new stuff then do it as an app with html and javascript.  (maybe its not new to you).


If you just want to get it done then create it in autocad which you know very well.  It doesnt look that difficult to do in AutoCAD.  The user would lay down some switches from a palette that you control and then draw a polyline between them which you would also control.  Each polyline would have to go from switch to switch.  This way you know how the wire network is laid out.  Then a simple matter of hooking up double click command of switch to change block dynamic states/wire colors.

[Jeff H]

Thanks Keith,

I really like the totally rewritten and new ASP 6 and think I will use that with html and javascript library.

The people using it could get someone in AutoCAD to run it if need be but rather use web app to update and maintain.

[MickD]

Hi Jeff,
Looks like a cool project!

I'm not sure of your experience with the following so bear with me if nothing is new, it may help others though

As it is a very interactive application you'll definitely be looking at javascript on the client side with data feeds and updates to/from the server via ajax to give the user a seamless experience and avoid page refreshes (jQuery).

For the graphics you can look into html5 canvas or WebGL with the html5 canvas probably being the easiest for a 2d schematic type drawing.

For the server side, it doesn't matter what tech you use as long as you are familiar with it. If you want to use javascript on both ends you can use node.js on the server side for instance.

So for your client side tech:
html5 with canvas or WebGL (THREE.js is a good library over WebGL)
jQuery (for dom manipulation and event handling and some UI goodies)
javascript (I use the 'modular' pattern approach and avoid frameworks personally)

server side:
whatever stack you are familiar with, perhaps with a RESTful api (but not essential and can add un-needed complexity).
MySQL or XML/JSON for image and data storage or a mix of both (XML/JSON for image geometry, db for object property data)

The hardest part is building the drawing engine as you will need to start from the very basics of capturing a drawing context, adding primitives, handling user input and serialising the geometry and data.
All the things we have in CAD built in already but there would no doubt be third party controls ready to go too.

[Jeff H]

Thanks Mick!
That makes me feel better that I am at least looking at some things as you mentioned.
I have also looked at
jointJs
GoJS

[MickD]

both cool projects!

this one seems appropriate http://jointjs.com/demos/logic

[tetrahidrocannabinol]

For .NET, maybe you could get some idea from here:
http://www.dataweb.de/en/products/diagramming.html
https://code.google.com/p/nshape/

[Jeff H]

Thanks tetrahidrocannabinol!

[CADbloke]

http://raphaeljs.com/ has been around a while and is worth a look at too. I like the look of http://jointjs.com/demos/logic (thanks Mick!). Geez, I haven't even written the desktop version of www.tvCAD.tv yet and I'm already distracted by the web version. Thanks also tetrahidrocannabinol ... and Jeff too!

[Jeff H]

This was little sample app just show what intent was, you should be able to click on switch to open or close switches if using a recent version of IE, edge, firefox, or chrome
http://hpadwebapplication.azurewebsites.net/Diagram/mvswitches
And now they want the one-line built in AutoCAD to do this.

The user would lay down some switches from a palette that you control and then draw a polyline between them which you would also control.  Each polyline would have to go from switch to switch.  This way you know how the wire network is laid out.  Then a simple matter of hooking up double click command of switch to change block dynamic states/wire colors.

Just typing out loud......
So I could probably use palette/command to basically just pass a block to the INSERT command but be able to mark it or save its objectId in a dictionary for switches, and do the same with polyline command to add and store connections.