[HN Gopher] Diagrams: Open-Source Alternative to Lucidchart
___________________________________________________________________
Diagrams: Open-Source Alternative to Lucidchart
Author : synergy20
Score : 165 points
Date : 2022-03-23 16:22 UTC (6 hours ago)
(HTM) web link (www.diagrams.net)
(TXT) w3m dump (www.diagrams.net)
| spellcard199 wrote:
| I 'm an heavy user of diagrams to take notes while learning
| topics in biology and medicine. I think the most interesting
| feature of diagrams.net is its extensibility, which is not
| frequently mentioned. If you run in the javascript console...
| var editorUi; Draw.loadPlugin(app => editorUi = app)
| var editor = editorUi.editor var graph = editor.graph
|
| ... then you can automate changes to the diagram using mxGraph's
| api [1] on the `graph' variable from the console.
|
| Around this plugin mechanism I wrote some dirty hacks for
| personal use to make the editor behave more to my likings [2]
| (some features stopped working with recent versions of the
| desktop app), and an even dirtier Emacs mode for editing labels
| and having the js REPL available directly from Emacs when I need
| to run some code to fix my diagrams programmatically [3] (based
| on Indium [4] + the fact that electron apps can be launched with
| --remote-debugging-port=...). It's not pretty, but works enough
| for me, and it's only thanks to the customizability that
| diagrams.net allows.
|
| [1] https://jgraph.github.io/mxgraph/docs/js-
| api/files/view/mxGr...
|
| [2] https://gitlab.com/spellcard199/drawio-plugin-eight-
| droves-o...
|
| [3] https://gitlab.com/spellcard199/emacs-drawio
|
| [4] https://github.com/NicolasPetton/Indium
| Veuxdo wrote:
| Diagrams is a great drag-and-drop tool, but drag-and-drop tools
| shouldn't be used for serious system diagramming:
| https://www.ilograph.com/blog/posts/its-time-to-drop-drag-an...
| abraae wrote:
| We opted for Mermaid (mentioned in your article) and auto-
| layout in our new offering.
|
| As you would expect, it has its pros and its cons. As diagrams
| get bigger and more complex, mermaid's auto-layout gets more
| and more challenged and more and more acres of white space
| start to appear. Of course drawing those same large diagrams
| manually would be a bitch too.
|
| At small scale, auto-layout is a no-brainer, but the jury is
| still out for us on large, real world diagrams.
| alexott wrote:
| I like PlantUML a lot
| lmc wrote:
| Take a look at Structurizr - https://structurizr.com/
|
| The guy that makes it is super helpful on twitter as well.
|
| Ah, I've just realised, the article above pointed to a quote
| by Simon Brown - he is the Structurizr guy :-)
| abraae wrote:
| Thanks for the link. All the examples look pretty simple
| and only use straight line connectors. We're building a no-
| code for HR platform, so the diagrams are large and really
| need curved connectors to maximise use of the space.
| mnahkies wrote:
| I completely agree with the sentiment of that post.
|
| I've generally always found it difficult to find something in
| this space that produces a layout that's easy to follow, and
| easy to experiment with.
|
| I think I'd like something that had: - layout constraints
| similar to the android relative layout - something like
| excalidraw that could dump the hand drawn diagram out to code
| for a bit of cleanup before going into VCS
|
| I'm imagining you could solve the ability to inject new
| sections with the constraints relatively easily but still
| retain a good amount of creative control to better tell the
| story.
|
| Any suggestions for tools to checkout?
| chrisweekly wrote:
| It's a slight tangent but as an Obsidian user, the Obsidian-
| Excalidraw plugin^1 is kind of jaw-droppingly, amazingly good
| at combining the many things each tool does well into a
| seamless, customizable UX.
|
| 1. https://github.com/zsviczian/obsidian-excalidraw-plugin
| wafer-bw wrote:
| The way that article suggests adding more ELBs to the diagram
| would take a lot of work with a drag and drop tool is
| hilariously bad, maybe the author should learn how to use drag
| and drop tools or maybe they are using terrible ones that don't
| let you also drag to select?
| dtjb wrote:
| Different uses for different audiences. That article addresses
| engineering use cases. But diagramming is also useful when
| discussing (and constantly revising) concepts and workflows
| with business users before any code is written. Drag and drop
| fits the bill just fine there.
| politician wrote:
| It's sad that nothing beats OmniGraffle.
|
| Ideally, I want diagrams-as-code with a supporting layout-as-
| code document for fine-tuning the presentation and a wysiwyg
| tool for manipulating that layout-as-code document.
|
| But I understand why none of this exists: the MVP is too big.
| jotm wrote:
| Wow, this is... awesome!
|
| I was looking for something like this for a while, OneNote works
| but it's quite tedious. Just a canvas for
| mindmaps/diagrams/ideas.
|
| This is one of the reasons I keep coming here, to discover new,
| useful software. Google is rather bad for that these days.
|
| Thank you very much!
|
| I'll see if I can contribute anything.
| igetspam wrote:
| Is this supposed to be a clever way of announcing that draw.io
| has been renamed to diagrams.net?
| dljsjr wrote:
| They wanted to move off .io for several reasons, they announced
| it a while back: https://www.diagrams.net/blog/move-diagrams-
| net
| IshKebab wrote:
| Ha that complaint about British Imperialism is hilarious. The
| British forced the original inhabitants off the island in the
| colonial era, thus denying their descendants the right to
| profit from an internet domain?? Madness.
| davidjgraph wrote:
| "Between 1967 and 1973, the Chagossians..."
| (https://en.wikipedia.org/wiki/Chagossians). That's the
| colonial era? They are plenty of Chagossians alive today
| that were evicted.
| yboris wrote:
| Related: _yEd_ graph editor with my favorite feature: automatic
| diagram untangling / re-arrangement / reflow.
|
| https://www.yworks.com/products/yed
| argella wrote:
| My company is forcing everyone back to Visio from diagrams.net
| because "it's included with m365".
|
| Shit deal.
| alpb wrote:
| Isn't this the well known https://draw.io rebranded?
| csunbird wrote:
| It definitely is!
| synergy20 wrote:
| it is, I especially like its offline desktop version(for all
| OSes). I don't think Lucidchart has a desktop version.
|
| and of course, it's totally free unless you want its paid
| Apps+cloud version, which in my case I don't.
| dtjb wrote:
| I'm not affiliated but if anyone is looking for BPMN diagramming
| I've found cawemo.com to be the best option out there.
| Lightweight, simple, online, free, and can be used for downstream
| automation.
| jrvarela56 wrote:
| If you're looking for a simpler drawing tool
| https://www.tldraw.com lets you draw and associate all kinds of
| shapes.
| hnarn wrote:
| I thought this was about the Python module "diagrams".
| tgsovlerkhgsel wrote:
| This is how the example chart on their homepage looks on my
| machine: https://i.imgur.com/al67CoQ.png - ugly font, labels
| crossing their boxes.
|
| I think they're sending me an SVG that my browser renders poorly,
| but that's a horrible first impression.
|
| That said, the tool itself looks pretty solid, much better than
| the only other open source alternative I know (dia). Like many
| open source tools the UI design looks a bit old and it's chock
| full of advanced features that make the basic ones hard to
| find/use, but it's certainly usable.
|
| And it's browser based, which means it runs anywhere, including
| Chromebooks.
| toastshaman wrote:
| This is also excellent. https://github.com/mingrammer/diagrams
| davidjgraph wrote:
| For those finding the UI too complex, there is the option of a
| simpler UI - https://app.diagrams.net/?splash=0&ui=sketch . That
| can be set under extras->theme->sketch.
| houqp wrote:
| I love the product, not only does it have an easy to use
| web/offline app, I am also able to checkin the diagram source
| into git for version control, see:
| https://github.com/roapi/docs/blob/main/src/images/roapi.dra....
| Then I can use automations to generate images based off that
| source file:
| https://github.com/roapi/docs/blob/main/src/images/roapi.svg.
| the_arun wrote:
| How can I share a link for the diagram with a friend/team
| member & collaborate?
| shagie wrote:
| Depends on how its shared... but... if you pull up
| https://app.diagrams.net
|
| Do an 'Open from' > 'URL...' and paste in
| http://shagie.net/wp-content/uploads/2015/05/Untitled-
| Diagra... (an example diagram I made several years ago) - its
| a png itself and you can open that up as a png, but I also
| exported it with the drawing embedded.
|
| So when you open that up in the app, you'll get the _drawing_
| - not the raster version.
|
| Also consider that I created that png _7 years ago_ - other
| drawing document formats have been less stable over that
| timeframe. I 'm quite impressed with it.
| davidjgraph wrote:
| Save it to Google Drive or OneDrive and share that with them.
| stevesimmons wrote:
| You can also save your drawings using the option that embeds
| the drawio diagram source into the rendered svg or png file,
| and check that single file into git.
|
| Then (a) no need for an automation to generate the image; (b)
| any image or svg is directly editable.
| thedougd wrote:
| You can also embed the source into a png or svg and commit
| those to the repo. Diagrams.net will allow you to open from the
| source embedded png or svg.
| riidom wrote:
| You can also use it as a wireframing/prototyping tool, or as some
| kind of free-form typing tool. Write something about the topic at
| hand in a box, make a list of things in another box, draw some
| sketch with some basic shapes in a 3rd box, arrange it all later
| on so similar things are together, etc. And then export to pdf
| (or html, but I'm more familiar with the pdf export)
| 725686 wrote:
| "When companies pay us money it should be because we add value,
| not because they are locked in."
___________________________________________________________________
(page generated 2022-03-23 23:00 UTC)