autoWidth and autoHeight are not working
I’m doing an attempt at creating a mind mapping application, and I want to visualize the mind map by using jit.
I’ve got the latest commit1, and I want to create a tree of nodes containing HTML. The HTML might be of any length and height. The tree could contain a label like “Things to do”, a label containing paragraph, or even label containing a table.
I want the labels to have a size set automatically based on their content, but I cannot get this to work by setting autoWitdth and autoHeight to true. These parameters don’t do anything.
I've got the source code on GitHub2, and this is the part of it that I think is relevant:
var st;
var json = {
id: "n1",
name: "root",
data: {},
children: [
{
id: "n2",
name: "foo1<br>foo2<br>foo3",
data: {},
children: [
// ...
]
},
{
id: "n3",
name: "bar",
data: {},
children: []
},
// ...
]
};
function init(){
st = new $jit.ST({
injectInto: 'view',
Node: {
autoHeight: true,
autoWidth: true,
},
onCreateLabel: function(label, node){
label.id = node.id;
label.innerHTML = node.name;
label.onclick = function() {
st.select(node.id);
};
},
});
st.loadJSON(json);
st.compute();
st.select(st.root);
}
I'm having the same problem :/
There's a test using autoHeight: true here. You can clone the project and run the example to see it working. More info on how to do that here.
Let me know if you have further questions.
Thanks Nicolas.
Sorry Nicolas but i have to confirm that at least myself can't make it work or i don't understand how this feature works. In the 'test6' node type is 'none' so practically only the label box is what is visible. I would be ok with that if the graph was plotted right. But there was gaps between connectors/edges and labels because i changed the value of padding for label (onCreateLabel() event).
So the only way to accomplish the autoHeight/autoWidth feature was to just iterate through json object, of course before loaded to ST and update the 'data' object for every node.