Parsing flow graph/parsing flowchart — What is this called and how can I make them?

Question

I just got linked to the JSON website, and the images stunned me. A better way to intuitively show the flow of a parser I have never seen. Now I want to be able to make these diagrams for my own projects.

First of all, what is this type of diagram called?

Is there a program that can generate these, or am I on my own?

Answer 1

The graphical EBNF editor for ANTLR grammars, ANTLRWorks, automatically generates syntax diagrams of the rules you type.

For example, if you type the following rule (and string and value are also present!):

object 
  :  '{' ((string ':' value) | ',')* '}'
  ;

ANTLRWorks immediately displays the following diagram at the bottom of the page:

which you can enlarge and export in various formats (EPS or bitmap).

Answer 2

Definitions: http://en.wikipedia.org/wiki/Syntax_diagram

When I googled for Syntax Diagram Tool, there are several listed.

I have some minor experience with the graphvis tool, see their wide ranging gallery at www.graphviz.org/Gallery

I hope this helps.