dynamically loading tree/graph parts

96 views
Skip to first unread message

Jakub Kotowski

unread,
Dec 2, 2009, 8:33:23 AM12/2/09
to JavaScript Information Visualization Toolkit
Hi,

how do I properly dynamically load new subtrees or graph parts? I'm
trying to do it via the function below in label.ondblclick set in
onCreateLabel: function(label, node) which is passed to new ST(...)
but I have a few problems with it. First, if I remove the alert()
before the jQuery json request then the whole thing just freezes and
does nothing. If I leave the alert where it is then it loads the
subtree as I would expect but the visualisation doesn't work anymore -
nothing happens when I click a node for example (I'm using the example
spacetree code, so it should highlight the node and the path to the
root) and it freezes totally if I try to change the tree orientation
using the radio buttons on the right.
I'm new to JavaScript so it may very well be a stupid mistake
somewhere but I can't see it.
See also the JSON tree I'm trying to display. The first one is loaded
at initialization, the second one is the subtree added on the double
click.

I'd be grateful for any ideas or pointers.

Cheers,
Jakub


onCreateLabel: function(label, node){
label.id = node.id;
label.innerHTML = node.name;
label.onclick = function(){
st.onClick(node.id);
Log.write("node:"+node.id);
};

label.ondblclick = function() {
//alert(node.data.type+": "+node.data.id);
url = "http://localhost:8080/KiWi/seam/resource/services/
widgets/explanation/explain?id="+node.data.id+"&jsonpCallback=?";

alert(url);
jQuery.getJSON(url,
function(data) {
var el = document.getElementById('debug');

var json = normalizeJSON(data);

if (node.loaded == undefined || node.loaded == false)
{
st.addSubtree(json, 'animate');
node.loaded = true;
} else {
st.removeSubtree(json[0].id, false, 'animate');
node.loaded = false;
}

st.refresh();

el.innerHTML += "<br/><p>"+JSON.stringify
(json)+"<p>";
}//function(data)
);

};



"[{"id": "id131087", "name": "id131087", "data": {"id": 131087,
"type": "triple"}, "adjacencies": ["IN(131086)RULE(-659876683)FACT
(131087)"]}, {"id": "IN(131086)RULE(-659876683)FACT(131087)", "name":
"JUSTIFICATION", "data": {"id": "IN(131086)RULE(-659876683)FACT
(131087)", "type": "justification"}, "adjacencies": ["id131086",
"id-659876683"]}, {"id": "id131086", "name": "id131086", "data":
{"id": 131086, "type": "triple"}, "adjacencies": []}, {"id":
"id-659876683", "name": "id-659876683", "data": {"id": -659876683,
"type": "rule"}, "adjacencies": []}]"



"[{"id": "id131086", "name": "id131086", "data": {"id": 131086,
"type": "triple"}, "adjacencies": ["IN(131081)RULE(-2079806943)FACT
(131086)"]}, {"id": "IN(131081)RULE(-2079806943)FACT(131086)", "name":
"JUSTIFICATION", "data": {"id": "IN(131081)RULE(-2079806943)FACT
(131086)", "type": "justification"}, "adjacencies": ["id131081",
"id-2079806943"]}, {"id": "id131081", "name": "id131081", "data":
{"id": 131081, "type": "triple", "$color": "#aaa"}, "adjacencies":
[]}, {"id": "id-2079806943", "name": "id-2079806943", "data": {"id":
-2079806943, "type": "rule", "$color": "#aaa"}, "adjacencies": []}]"

Jakub Kotowski

unread,
Dec 2, 2009, 9:32:12 AM12/2/09
to JavaScript Information Visualization Toolkit
I'll answer myself. It was indeed a stupid mistake: the onClick() and
ondblclick() functions apparently clashed and freezed the script.
Moving the functionality to one of the controllers solved the problem.
I guess I also could synchronize somehow instead.

Jakub


Reply all
Reply to author
Forward
0 new messages