Hi,
I'ved been going through your example and really would like to thank
you first is helping me.
i'm trying to use the example you gave into the program that i have
currently.since i need to pass the nodes and edges to javascript to
calculate the shortest path and then
send it back to svg to draw the chosen shortest-path.
my questions are ;) :
1. your program does create the node,edges and circle automatically,
if mine just get
from the existing path drawn in svg, do i have to put the nodes in
the array? like
nodes.push(newNode)?the thing i'm concern is could it be done without
the newNode.x
?just straight using mine like newNode = SVGDocument.getElementById
("circle")?
2.what does the var l and var c does actually?
3.still it doesnt work coz i dont think it is able to send the value
from svg to the script and back to svg.
i tried to do it here.. but still dont know what relevent l and c is.
i'ved inserted my prog here with some Q within it.
thanks for helping me and do appreciate feedback on this.
<?xml version="1.0"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd";>
<svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg'
xmlns:xlink='http://www.w3.org/1999/xlink' onload='Init(evt)'>
<script xlink:href="dijkstra.js"/>
<script>doc<![CDATA[
var SVGDocument = null;
var SVGRoot = null;
var svgns = 'http://www.w3.org/2000/svg';
var xlinkns = 'http://www.w3.org/1999/xlink';
function Init(evt)
{
var SVGDocument = evt.target.ownerDocument;
var SVGRoot = SVGDocument.documentElement;
var allPath= SVGDocument.getElementsByTagNameNS
(svgns, 'path');
var NUMBER_EDGES = allPath.length;
alert("edges " +NUMBER_EDGES);
//var nodes = new Array();
};
var NUMBER_NODES = 3;
alert("nodes "+NUMBER_NODES);
//********************************************************************
***************
// Initialize an adjacency matrix
var adjacencyMatrix = new Array(NUMBER_NODES);
for (var i = 0; i < NUMBER_NODES; i++)
{
adjacencyMatrix[i] = new Array(NUMBER_NODES);
for (var j = 0; j < NUMBER_NODES; j++)
{
adjacencyMatrix[i][j] = Infinity;
}
}
//********************************************************************
***************
//calculating edges
//calculate edges and add them to the document
for (var j = 0; j < NUMBER_EDGES; j++) {
var from = j % NUMBER_NODES;
var min = Infinity;
var to = from;
for (var i = 0; i < NUMBER_NODES; i++) {
var eachPath = allPath.item(i);
eachPath.setAttributeNS(null, 'stroke', 'blue');
if (from != i && adjacencyMatrix[from][i] == Infinity) {
var distance = Math.round(eachPath.getTotalLength());
alert("Distance "+distance);
if (distance < min) {
min = distance;
to = i;
}
}
}
adjacencyMatrix[from][to] = min;
adjacencyMatrix[to][from] = min;
//add newNode here?
var l = SVGDocument.createElementNS
(SVG_NAMESPACE_URI, "line");
if (to < from) {
id += String(to) + from;
} else {
id += String(from) + to;
}
l.setAttributeNS(null, "id", id);
l.setAttributeNS(null, "x1", nodes[from].x);
//l.setAttributeNS(null, "path" , nodes[from]); this way??
l.setAttributeNS(null, "y1", nodes[from].y);
l.setAttributeNS(null, "x2", nodes[to].x);
l.setAttributeNS(null, "y2", nodes[to].y);
SVGDocument.documentElement.appendChild(l);
}
//add point for the nodes
for(var i=0;i <NUMBER_NODES; i++) {
var c = SVGDocument.createElementNS
(SVG_NAMESPACE_URI, "circle");
c.setAttributeNS(null, "id", "c" + i);
c.setAttributeNS(null, "point",
SVGDocument.getElementsByTagNameNS(svgns, 'c'));
//c.setAttributeNS(null, "onclick", "setActive(" + i + ")");
SVGDocument.documentElement.appendChild(c);
}
//********************************************************************
***************
//Start with node 0 as active node
var activeNode = 0;
SVGDocument.getElementById("c0").setAttributeNS
(null,"class", "current");
var shortestPathInfo = shortestPath(adjacencyMatrix,
NUMBER_NODES, 0);
//********************************************************************
***************
//Hide the path highlights
function clearPath() {
for (var i = 0; i < NUMBER_NODES; i++) {
for (var j = i + 1; j < NUMBER_NODES; j++) {
if (adjacencyMatrix[i][j] != Infinity) {
SVGDocument.getElementById("path" + i +
j).setAttributeNS(null, "class", "");
}
}
}
}
//********************************************************************
***************
//Show path form the active node to the given node
function showPath(to) {
clearPath();
if(activeNode != to) {
var c = SVGDocument.getElementById("c" + to);
c.setAttributeNS(null, "class", "highlight");
var path = constructPath(shortestPathInfo, to);
var prev = activeNode;
var distance = 0;
for (var i = 0; i < path.length; i++) {
var id;
if (path[i] < prev) {
id = "path" + path[i] + prev;
} else {
id = "path" + prev + path[i];
}
var l = SVGDocument.getElementById(id);
l.parentNode.removeChild(l);
l.setAttributeNS(null, "class", "highlight");
SVGDocument.documentElement.insertBefore(l, divider);
distance += adjacencyMatrix[prev][path[i]];
prev = path[i];
}
SVGDocument.getElementById("d").firstChild.nodeValue
= "Distance: " + distance;
}
}
//********************************************************************
***************
// Unhighlight the path from the active node to the given node
function hidePath(to) {
clearPath();
if (activeNode != to) {
var c = SVGDocument.getElementById("c" + to);
c.removeAttributeNS(null, "class");
}
}
//********************************************************************
***************
// Choose a new active node
function setActive(to) {
SVGDocument.getElementById("c" + activeNode).removeAttributeNS
(null, "class");
clearPath();
activeNode = to;
shortestPathInfo = shortestPath(adjacencyMatrix, NUMBER_NODES,
to);
SVGDocument.getElementById("c" + activeNode).setAttributeNS
(null, "class", "current");
}
]]></script>
<g>
<path id='path1' stroke-width='1' stroke='blue' fill='none' stroke-
linecap='round'
d='M300,25 450,100'/>
<path id='path2' stroke-width='1' stroke='blue' fill='none' stroke-
linecap='round'
d='M300,25 250,150'/>
<path id='path3' stroke-width='1' stroke='blue' fill='none' stroke-
linecap='round'
d='M450,100 250,150'/>
</g>
<g>
<circle id='c0' cx='300' cy='25' r='5' fill='red'/>
<circle id='c1' cx='450' cy='100' r='5' fill='gold'/>
<circle id='c2' cx='250' cy='150' r='5' fill='red'/>
</g>
<a>
<text x="10" y="20" font-weight="bold">Dijkstra Dummy</text>
<text id="d" x='10' y='590' font-size='18px' fill='crimson'>Distance:
</text>
</a>
</svg>
------------------------ Yahoo! Groups Sponsor --------------------~-->
$4.98 domain names from Yahoo!. Register anything.
http://us.click.yahoo.com/Q7_YsB/neXJAA/yQLSAA/1U_rlB/TM
--------------------------------------------------------------------~->
-----
To unsubscribe send a message to: [EMAIL PROTECTED]
-or-
visit http://groups.yahoo.com/group/svg-developers and click "edit my
membership"
----
Yahoo! Groups Links
<*> To visit your group on the web, go to:
http://groups.yahoo.com/group/svg-developers/
<*> To unsubscribe from this group, send an email to:
[EMAIL PROTECTED]
<*> Your use of Yahoo! Groups is subject to:
http://docs.yahoo.com/info/terms/
