40

Actually I had downloaded an GUI for graphviz (dont remember the site), which said that they had won an Apple Design Award. But that tool really only displays an *.dot file I created. That's it. It's just called "Graphviz"... I guess that there are better tools around for using the Graphviz technology.

I tried this one: link text

Although they say that they won an Apple Design Award, I really can't see any special GUI there. Very poor interface.

Thanks
  • 40,109
  • 71
  • 208
  • 322
  • 3
    As graphviz does automatic layout, what exactly do you expect from a WYSIWYG editor? Visual property editing? – Andy Dent May 27 '09 at 16:14
  • 1
    The plugin for the Atom editor is top-notch for working with GraphViz projects - https://atom.io/packages/graphviz-preview – Dennis Snell Feb 03 '16 at 02:59
  • There is also a Sublime Text 3 Plugin which can render graphviz image in real time. https://packagecontrol.io/packages/Graphvizer – haolee Jan 31 '18 at 03:55

7 Answers7

21

The current version of Graphviz.app does not contain the "external editor" button shown in rampion's screenshot above - Or the Render/Stop buttons, and it has replaced the "settings" button with "attributes". However, it can be used as described.

I downloaded 'graphviz-2.27.20101110.0545.pkg' from http://graphviz.org/Download_macos.php. Note that there are several places to download various things which call themselves Graphviz:

Use the first one, I chose the most recent development snapshot - A glance at the mailing lists (interest and devel) reveal that it's still pretty active, which you wouldn't know from the pixelglow sites that still have "Content coming soon" messages from 2004.

Anyways, when 2.27 is started, it throws up an "Open" dialog. Opening a .dot file will show a graph, but cancelling reduces you to nothing but a menu bar. Don't be dismayed, create a file with the text 

graph graphname {
}

and call it something.dot.

Open that in Graphviz, and you get a GUI with an empty graph:

alt text

Type in some more text into the file, like this:

graph graphname {
  a -- b -- c -- d -- a;
  a -- c;
  b -- d;
}

The Graphviz window automatically updates when you save to show this:

alt text

There are a plethora of options in the "Attributes" toolbox, but it looks like they want you to edit the source by hand. I kind of expected "Add vertex" and "Add edge" buttons, and the ability to move vertices around, but that's not what it's about, apparently.

So, apparently, the WYSIWYG editor is your favorite text editor on one side of the screen, and Graphviz on the other. As far as an IDE goes, it looks like the best thing available right now is a printout of the documentation for the DOT format. Not everybody's idea of a WYSIWYG editor or IDE, but it probably works for active users.

Community
  • 1
  • 1
Kevin Vermeer
  • 2,736
  • 2
  • 27
  • 38
  • 1
    This should be selected as the "correct" answer since it explains how to do this with the *current* GraphViz version. – chaimp Jan 05 '12 at 06:11
  • 1
    @jeffp - The author of the question hasn't been seen since November of '09, so that's unlikely to happen. Plus, we're now on 2.28, with development proceeding on 2.29, so it's not truly *current* anymore. (It is, however, more current than 1.13, which is the version cited in the highest-voted answer) – Kevin Vermeer Jan 05 '12 at 14:29
9

Graphviz.app has a command to open the current dot file in an external editor. If you use that, it will monitor the file handle for changes, and update the graph after each time you save in the external editor. That's how you can get it to work as a WYSIWYG interface.

graphviz

The 'Edit' button's in the upper left hand corner, next to 'Settings'.

Actually it monitors the file handle continally anyway, so what I do is open the dot file in Graphviz.app, fire up vim and edit the dotfile (with set backupcopy=yes) and watch the graph update after each :w.

Kevin Vermeer
  • 2,736
  • 2
  • 27
  • 38
rampion
  • 87,131
  • 49
  • 199
  • 315
  • if you're talking about the Pixelglow software: I can't see any option to launch any editor. It simply opens an *.dot file and displays it. Nothing else. Which software do you mean? – Thanks May 02 '09 at 11:30
  • I'm talking about Graphviz.app from pixelglow, yes. See the above screenshot. – rampion May 02 '09 at 12:00
  • This is with version 1.13 (16). I tried to install the new one just now (graphviz-2.22.2.pkg) but I couldn't get it to work on my machine, so it may have a different interface. – rampion May 02 '09 at 12:23
  • it seems you've got some lucky other version. mine really shows just a menu. that's it. No interface at all. If I open a file, then I only have a blank window with the rendered graph. But the instant refresh does work when I open it up in that app and then in an text editor. – Thanks May 04 '09 at 19:45
  • 1.13 is still available : http://www.pixelglow.com/downloads/graphviz-1.13-v16.dmg – rampion May 05 '09 at 01:22
  • 1
    1.13 is only available for ppc. You can build your own copy of a newer version using homebrew, or just from source (but follow the homebrew recipe) – keflavich Nov 21 '12 at 23:06
8

Not exactly what you're asking for - but the potential of the projects I'm going to mention is pretty huge - as a graphviz fan I've been really amazed at what is now possible.

The short history:

  • http://ushiroad.com/jsviz/ - ushiroad cooked up this lil guy. Using the Emscripten project he cross-compiled enough of graphviz to get layout and basic node stuff as a pure javascript app. You have to click the little round-arrow button on the bottom-right of the DOT src frame.

The only down-side (which in no way diminishes the awesomeness of porting graphviz to javascript) is the limitation on what you can do with it. it's basically just dot layout with a couple primary shaped nodes - doesn't support color. etc.

The author was awesome enough to upload his work to github, https://github.com/gyuque/livizjs

So, if you were so inclined - you could pretty easily take one of the lightweight (but pro!) in-browser editors like CodeMirror (it has vi key support) - and rig up a 'render' button like jsviz.

So.. not exactly what you were looking for. But holy moly for the person who spends a little time on this problem - a bounty of web based client-side graphing tools await.

pimgeek
  • 259
  • 1
  • 6
  • 17
synthesizerpatel
  • 27,321
  • 5
  • 74
  • 91
3

There was a UI called dotty. I don't remember it being very nice to use.

http://linux.die.net/man/1/dotty

philcolbourn
  • 4,042
  • 3
  • 28
  • 33
  • 3
    Dotty is absolutely horrible. There are graphics glitches constantly, I can't even figure out how to save changes, and it's really hard to get the changes I want anyway. – Qwertie Jul 22 '10 at 21:24
  • 2
    Ease-of-use and glitches aside, my math professor said it's the way to go... – Kevin Vermeer Nov 10 '10 at 18:51
3

The excellent OmniGraffle can import *.dot files, but sadly I don't think you can round-trip it back and export the edited results as a dot file natively.

  • OG uses graphviz, as far as i know... I think I'll get OG some day, when I make some coins on the app store ;) – Thanks May 04 '09 at 19:46
2

Pixelglow looks like the site you're referring to.

I note they now offer an IPhone-enabled solution (!)

Brian Agnew
  • 268,207
  • 37
  • 334
  • 440
  • yes they do, but that's not an option. They should rather improve their mac app, I think ;) ... really, the app is not even close to what the screenshot shows. It consists only of a menu bar that allows to open a file and to zoom in and out. it hasn't got any more capacity then that. I don't believe they won any award. – Thanks May 02 '09 at 11:31
  • Yes. I've not looked at it. I only note it for people's reference – Brian Agnew May 02 '09 at 11:33
  • Yes the original won an award which was largely for the adaption to Mac technology. It was branched and now left behind because it was a complete rewrite of the Graphviz rendering engine. Currently Glen is working on the new GUI for GraphViz viewing and rendering on Mac and Windows, which has stepped back a bit in GUI quality but is on the main track for the source. I believe AT&T are funding some of his work but not the excellent Instaviz on iPhone. – Andy Dent May 27 '09 at 16:12
0

Another solution might be tintfu. Unfortunately it does not let you edit the source-code directly.

exhuma
  • 20,071
  • 12
  • 90
  • 123
  • 2
    I couldn't figure out how to use it... it doesn't display any graphical output, and it's easier to use a text editor than to edit the graph in the left pane. – Qwertie Jul 22 '10 at 21:28
  • I only gave it a quick try myself. When I tried it, it worked as advertised. But as you say, editing the source by hand is much easier, and so I did not follow up on this app. – exhuma Aug 12 '10 at 09:39