13-02-2010, 02:16 AM
Vu que j'avais que ça à faire, -et histoire de ne pas l'avoir fait pour rien (xD)- je vous passe le svg pour visualiser le tout.
On peut passer dans l'url les valeurs n, c, space (espace entre cercle) et r (rayon).
Par défaut n=5, c=4, space=10, r=50
On peut passer dans l'url les valeurs n, c, space (espace entre cercle) et r (rayon).
Par défaut n=5, c=4, space=10, r=50
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
"http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xml:lang="fr" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1500px" height="1500px">
<title>Nœuds adjacents pour un cercle</title>
<script type="text/javascript">
<![CDATA[
function event(el, type, fn)
{
if (el.addEventListener)
el.addEventListener(type, fn, true);
else if (el.attachEvent)
el.attachEvent("on"+type, fn);
else
el["on"+type] = fn;
}
Uri = {
get : function()
{
var params = new Array(),
first = window.location.search.slice(1,window.location.search.length).split("&");
for(var i in first)
{
var second = first[i].split("=");
if (second[0])
params[second[0]] = second[1] | "" ;
}
return params;
}
};
function intval(v, d)
{
if ("undefined" !== typeof v)
{
v = parseInt(v);
return (v == "NaN") ? d?d:0 : v;
}
return d?d:0;
}
event(window, "load", function(){
var get = Uri.get(),
n = intval(get["n"], 5), //nombre de spirale
c = intval(get["c"], 4), //nombre de cercle dans la première spirale
space = intval(get["space"], 10), //espace entre les cercles
r = intval(get["r"], 50), //rayon d'un cercle
d = space + r, //distance qui sépare un cercle à un autre
o = r + n*(r+d), //position x et y de l'origine
svg = document.documentElement;
svg.setAttribute("width", o*2);
svg.setAttribute("height", o*2);
var id = function(x,y)
{
return "circle-"+x+"-"+y;
}
var adjacent = function(x, y)
{
//origine
if (x === 0 && y === 0)
{
var circles = new Array();
for (var i=0; i<c; ++i)
circles[i] = id(x+1, y+i);
}
else
{
var y1 = Math.floor(y * (1 + 1/x)),
y2 = Math.floor(y * (1 - 1/x)),
cn = c*x - 1,
circles = new Array(
id(x, (y+1 > cn) ? 0 : y+1), //condition sur fin de cercle
id(x, y ? y-1 : cn), //condition sur début de cercle
id(x+1, y1),
id(x-1, y2),
id(x+1, y1+1)
);
//axe
if (y === 0 || y%x === 0)
{
circles[5] = id(x+1, y ? y * (1 + 1/x) -1 : cn+c); //condition sur début de cercle
}
else
{
circles[5] = id(x-1, (y2+c+1 > cn) ? 0 : y2+1); //condition sur fin de cercle
}
}
for (var i in circles)
circles[i] = document.getElementById(circles[i]);
return circles;
}
var circleInit = function(x, y, cx, cy)
{
circle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
circle.setAttribute("cx", cx);
circle.setAttribute("cy", cy);
circle.setAttribute("r", r);
circle.setAttribute("id", id(x,y));
event(circle, "mouseover", function(){
var c = adjacent(x,y);
for (var i in c)
{
if (c[i])
c[i].setAttribute("fill","red");
}
});
event(circle, "mouseout", function(){
var c = adjacent(x,y);
for (var i in c)
{
if (c[i])
c[i].removeAttribute("fill");
}
});
return circle;
}
//nœud d'origine
svg.appendChild(circleInit(0, 0, o, o));
for (var x = 1; x <= n; ++x)
{
var maxY = c*x, //4 équivaut au nombre cercle à la première spirale
p = Math.PI/maxY*2, //distance d'angle séparant les points
op = x * (r+d), //distance entre origine et point
a = -Math.PI/2; //angle de début pour que les y=0 soit diriger vers le haut
for (var y = 0; y < maxY; ++y)
{
var cx = o + op * Math.cos(a),
cy = o + op * Math.sin(a);
svg.appendChild(circleInit(x, y, cx, cy));
//affiche du texte
var text = document.createElementNS("http://www.w3.org/2000/svg", "text");
text.setAttribute("x", cx);
text.setAttribute("y", cy);
text.setAttribute("fill", "yellow");
text.appendChild(document.createTextNode(x+";"+y));
svg.appendChild(text);
a += p;
}
}
});
]]>
</script>
</svg>