the vivagraph javascript library (webgl svg'den daha hızlıdır - örneğin d3'te) sayesinde Chrome'da görüntüleyebileceğim yaklaşık 5000 düğüm ve 5000 bağlantı içeren bir grafiğim var.Bir web sayfasında Büyük Grafik görselleştirme: networkx, vivagraph
Benim iş akışı: networkx piton kütüphane ve çıkış bir json dosyası olarak sonuç ile
- Binası.
- Json'u yükleyin ve grafiği the vivagraph javascript library ile yapılandırın.
- Düğümler pozisyonları sorun iyi positionned düğümlerle düzenini işlemek için zaman almasıdır js kütüphanesine
tarafından hesaplanır. Benim yaklaşımım, örneğin, networkx numaralı düğümdeki düğüm konumunu önceden hesaplamaktır. Bu yaklaşımdaki gerçekten iyi nokta, istemci çalışmalarının tarayıcıda en aza indirilmesidir. Ancak web sayfasında iyi pozisyonlar alamıyorum. Bu adımda yardıma ihtiyacım var. Şimdi Gephi çalışıyorum
/*global Viva*/
function graph(file){
var file = file;
$.getJSON(file, function(data) {
var graphGenerator = Viva.Graph.generator();
graph = Viva.Graph.graph();
# building the graph with the json data :
data.nodes.forEach(function(n,i) {
var node = graph.addNode(n.id,{d: n.d});
# node position is defined in the json element attribute 'pos'
node.position = {
x : n.pos[0],
y : n.pos[1]
};
})
# adding links between nodes
data.links.forEach(function(l,i) {
graph.addLink(data.nodes[l.source].id, data.nodes[l.target].id);
})
var max_link = 55
var min_link = 1
var colors = d3.scale.linear().domain([min_link,max_link]).range(['#F0F0F0','#252525']);
var layout = Viva.Graph.Layout.forceDirected(graph, {
springLength : 80,
springCoeff : 0.0008,
dragCoeff : 0.001,
gravity : -5.0,
theta : 0.8
});
var graphics = Viva.Graph.View.webglGraphics();
graphics
.node(function(node){
# color and size of nodes
color = colors(node.links.length)
if(node.id == "root"){
// pin node on canvas, so no position update
node.isPinned = true;
size = 60;
} else {
size = 20+(7-node.id.length)*(7-node.id.length);
}
return Viva.Graph.View.webglSquare(size,color);
})
.link(function(link) {
# color on links
fromId = link.fromId;
toId = link.toId;
if(toId == "root" || fromId == "root"){
return Viva.Graph.View.webglLine("#252525");
} else {
if(fromId[0] == toId[0]){
linkcolor = linkcolors(fromId[0])
return Viva.Graph.View.webglLine(linkcolor);
} else {
linkcolor = averageRGB(linkcolors(fromId[0]),linkcolors(toId[0]))
return Viva.Graph.View.webglLine('#'+linkcolor);
}
}
});
renderer = Viva.Graph.View.renderer(graph,
{
layout : layout,
graphics : graphics,
enableBlending: false,
renderLinks : true,
prerender : true
});
renderer.run();
});
}
, ama istemiyorum: javascript, benim sayfa Sonra
## positionning
try:
# Position nodes using Fruchterman-Reingold force-directed algorithm.
pos=nx.spring_layout(G)
for k,v in pos.iteritems():
# scaling tentative
# from small float like 0.5555 to higher values
# casting to int because precision is not important
pos[k] = [ int(i*1000) for i in v.tolist() ]
except Exception, e:
print "positionning failed"
raise
## setting positions
try:
# set position of nodes as a node attribute
# that will be used with the js library
nx.set_node_attributes(G,'pos', pos)
except Exception, e:
print "getting positions failed"
raise e
# output all the stuff
d = json_graph.node_link_data(G)
with open(args.output,'w') as f:
json.dump(d,f)
:
düğüm konum hesaplaması için ilgili piton kodudur java kullanılmadığı için gephi toolkit kullanın.
Hi tarafından bu ayarlamak deneyebilir? – Maziyar
Merhaba, aslında başka bir tür bir çözüme geçtim: svg'de statik bir grafik görüntülemek için d3.js'yi kullanıyorum, sonra (büyük) svg'yi kaydedip büyük bir çözünürlükle png olarak yapıyorum. Sonra gda2tiles.py ile fayans olsun ve ala google haritalar görüntülemek için leafletJS kullanın! – user1254498
Vay, bu çok iş! Paylaşım arkadaşı için teşekkürler :) – Maziyar