vis.render() в настоящее время вызывается до того, как вы получите данные. Могут быть и другие проблемы, но они должны быть после getNet().
РЕДАКТИРОВАТЬ 1:
vis.render() теперь после getNet(). Я поместил код создания макета прототипа в функцию, чтобы я мог контролировать его выполнение, и сделал переменные vis и followers видимыми как для кода инициализации, так и для кода createLayout.
Протовис, в частности расклад сил, очень не прощает ошибок - например, неправильная структура или количество элементов для структуры данных узлов / ссылок, и не говорит вам, что происходит, поэтому при разработке лучше сначала использовать статические данные, которые, как вы знаете, имеют правильный вид, а затем заменить на динамически созданные данные .
Одна часть проблемы, с которой вы столкнулись, заключается в том, что type="text/javascript+protovis"
вызывает переписывание javascript с помощью protovis. Приведенный ниже код использует type="text/javascript" и имеет дополнительные {} с и return с, которые сохраняются с помощью +protovis. Это позволяет getJSON() и protovis сосуществовать в браузере Chrome без повторного вызова getNet().
<html><head><title></title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="protovis-d3.2.js"></script>
<body>
<div id="center"><div id="fig">
<script type="text/javascript">
var vis;
var followers={};
function createLayout(){
var w = document.body.clientWidth,
h = document.body.clientHeight,
colors = pv.Colors.category19();
vis = new pv.Panel()
.width(w)
.height(h)
.fillStyle("white")
.event("mousedown", pv.Behavior.pan())
.event("mousewheel", pv.Behavior.zoom());
var force = vis.add(pv.Layout.Force)
.nodes(followers.nodes)
.links(followers.links);
force.link.add(pv.Line);
force.node.add(pv.Dot)
.size(function(d){ return (d.linkDegree + 4) * Math.pow(this.scale, -1.5);})
.fillStyle(function(d){ return d.fix ? "brown" : colors(d.group);})
.strokeStyle(function(){ return this.fillStyle().darker();})
.lineWidth(1)
.title(function(d){return d.nodeName;})
.event("mousedown", pv.Behavior.drag())
.event("drag", force);
//comment out the next line to remove labels
//.anchor("center").add(pv.Label).textAlign("center").text(function(n) n.nodeName)
vis.render();
}
function getNet(){
// OK to have a getJSON function here.
followers={nodes:[{nodeName:'mweller', group:6},
{nodeName:'mhawksey', group:6},
{nodeName:'garethm', group:6},
{nodeName:'gconole', group:6},
{nodeName:'ambrouk', group:6}
],
links:[
{source:0, target:1, value:1},
{source:1, target:2, value:1},
{source:1, target:4, value:1},
{source:2, target:3, value:1},
{source:2, target:4, value:1},
{source:3, target:4, value:1}]};
}
$(document).ready(function() {
getNet();
createLayout();
})
</script>
</head>
</div></div>
</body></html>
РЕДАКТИРОВАТЬ 2:
В случае, если вы заинтересованы в копании немного глубже, проблема заключается в следующем коде в protovis:
pv.listen(window, "load", function() {
pv.$ = {i:0, x:document.getElementsByTagName("script")};
for (; pv.$.i < pv.$.x.length; pv.$.i++) {
pv.$.s = pv.$.x[pv.$.i];
if (pv.$.s.type == "text/javascript+protovis") {
try {
window.eval(pv.parse(pv.$.s.text));
} catch (e) {
pv.error(e);
}
}
}
delete pv.$;
});
Техника, которую я использовал для использования "text/javascript" и избегания использования "text/javascript+protovis", и решает вашу проблему, и облегчает отладку кода с использованием Protovis в Firefox.