[Top][All Lists]

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Re: [Axiom-developer] Axiom Code Graphs

From: daly
Subject: Re: [Axiom-developer] Axiom Code Graphs
Date: Sun, 04 Dec 2011 19:42:01 -0500

Look at the file

It is a json format file. The top level is a hashmap of 2 items
{"nodes": { ... },
 "edges": { ... }

Each node is a pair, as in:

  "ABELGRP" : {"c":"back" , "visible":"show"}

Each edge is a pair, as in:

  "ABELGRP" : {"CABMON":{},"LMODULE":{},...}

The node data structure gives a label ("ABELGRP") for every
node in the graph. The attributes are used to control how to
color the node ("back" == background color) and whether to
show the node (
"visible" == "show" ==> show it
"visible" == "hide" ==> hide it
"visible" == "icon" ==> show a rectangle without a label

The edge data structure determines lines between the nodes.
So "ABELGRP" has a line to "CABMON", "LMODULE", etc...

The color attribute is interpreted in the file axiomgraph.js

There is a variable called "tencolors" which gives meaning to the
"c" variable. So "back" becomes "#ECEA81" which is the background
color of the page. This makes the bounding rectangle disappear and
leave only the text. The background color of the page is determined
in the file
with the "body" CSS tag. The color "ECEA81" is the new global color
of the Axiom web pages.

The variable "tencomplement" is the inverse color so the text will
show up on the bounding box. So setting the "c" variable to "calls"
will set the box background color to "#0000FF" and the text in the
box to "#FFFF00".

The "visible" variable is interpreted (badly) in the axiomgraph.js
file at line 66 (to determine line colors) and line 210 (to determine
whether the text shows).

If you copy the axiomgraph subdirectory
you will have a complete, working copy. Then you can modify the
maps subdirectory with a new map.

When adding a new map you need to change lines 180 to include
your new map. For example, to create a new map "nguyen.json"

in maps/nguyen.json:
  {"node1" : {"c":"White","visible":"show"},
   "node2" : {"c":"Yellow","visible":"show"}
  {"node1" : {"node2":{}},
   "node2" : {"node1":{}}

add a new in axiomgraph.js that reads:

The _sources variable is at line 174. Add the line
mine:'I am the source of this graph'
and it will show up in the "datalink" div at the bottom
of the screen. The "datalink" dev is defined in index.html

Let me know if you have any questions.


On Mon, 2011-12-05 at 10:54 +1100, Minh Nguyen wrote:
> Hi Tim,
> On Mon, Dec 5, 2011 at 5:24 AM,  <address@hidden> wrote:
> > I am experimenting with dynamic code graphs for the Axiom source code.
> > I have put up 3 graphs, two come from the Jenks book flyleaf.
> > One is the graph of the source code for the compiler.
> Do you happen to know how the graphs are produced?  I'm interested in
> an automated way to produce such graphs from each source release of
> Axiom.

reply via email to

[Prev in Thread] Current Thread [Next in Thread]