Zorya - JavaSript Graph (Edges, Vertexes) library

Zorya is a JavaSript Graph (Edges, Vertexes) library. The aim of the project is to provide multi-browser library for graph drowning and managing. Graph instance can be initialized with simple JavaScript graph structure and in the future release the Graph will be serialized back to the graph structure. The structure can be further used to generate JSON string/object.

Example1: Graph Site MapPlease drag the node.

Please drag the node.
Currently Zorya works only under Mozilla/Firefox.

JavaScript Example:

<html>
<head>

<script type="text/javascript" src="js/init.js"></script>
<link rel="stylesheet" type="text/css" href="css/zorya.css" />
<style type="text/css" media="all">
		@import "css/main.css";
	</style>
<script type="text/javascript" src="js/org/tool-man/core.js"></script>
<script type="text/javascript" src="js/org/tool-man/events.js"></script>
<script type="text/javascript" src="js/org/tool-man/css.js"></script>
<script type="text/javascript" src="js/org/tool-man/coordinates.js"></script>
<script type="text/javascript" src="js/org/tool-man/drag.js"></script>
<script type="text/javascript" src="js/org/wz_jsgraphics/walterzorn.js"></script>
<script type="text/javascript"
	src="js/org/wz_jsgraphics/wz_jsgraphics.js"></script>

<script type="text/javascript" src="js/org/zorya/0_2/util/zoryacore.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/util/debug.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/model/edgemodel.js"></script>
<script type="text/javascript"
	src="js/org/zorya/0_2/model/vertexmodel.js"></script>
<script type="text/javascript"
	src="js/org/zorya/0_2/model/graphmodel.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/view/genericdiv.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/view/graphview.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/view/vertexview.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/view/edgeview.js"></script>
<script type="text/javascript" src="js/org/zorya/0_2/controller/edge.js"></script>
<script type="text/javascript"
	src="js/org/zorya/0_2/controller/vertex.js"></script>
<script type="text/javascript"
	src="js/org/zorya/0_2/controller/graph.js"></script>

</head>
<body>
<div id="drawCanvas"	style="position: absolute;height:500px;width:500px;left: 0px; top: 0px;"></div>
<div id="canvas"	style="position: absolute;height:500px;width:500px;left: 0px;top: 30px;"></div>

<script language="JavaScript"><!--

var vertexes = new Array();
var edges = new Array();
var V = {"vertexes": [
        {"id": "1", "name" : "Main page", "x": 30, "y": 400, "url": "index.html"},
        {"id": "2", "name" : "About Us", "x": 200, "y": 120, "url": "aboutUs.html" },
        {"id": "3", "name" : "Stories", "x": 220, "y": 420, "url": "TravelStories.html" },
        {"id": "4", "name" : "Photos", "x": 220, "y": 300, "url": "Travel.html" },
        {"id": "5", "name" : "Blog", "x": 200, "y": 200, "url": "WebDesignBlog.html" },
        {"id": "6", "name" : "Contact", "x": 200, "y": 2, "url": "contact.html" }
    ]
};

var E = {"edges": [
        {"id": "1", "from" : 1, "to": 2, "name": "1"},
        {"id": "2", "from" : 1, "to": 3, "name": "2"},
        {"id": "3", "from" : 1, "to": 4, "name": "3"},
        {"id": "4", "from" : 1, "to": 5, "name": "4"},
        {"id": "5", "from" : 1, "to": 6, "name": "5"}
    ]
};


Zorya.debug().setDebug(0);
function dragTheWindow() {}
var jg = new jsGraphics("drawCanvas");
var drawCanvasDiv = new GenericDiv("drawCanvas"); 
var graphCanvas = new GenericDiv("canvas"); 
var drag = ToolMan.drag();
Zorya.debug().alert('Create graph', 10);

var graph = Zorya.Graph(1, '1', drag, "#AAAAAA", V, E);
graph.initialize(graphCanvas);
//-->
</script>
</body>
</html>

Credits:

tool-man version 0.2 by Tim Taylor tim@tool-man.org
wz_jsgraphics by Walter Zorn