I want to build an interactive network on the lines of :-
Class, Subclass, Company, Product,
Chocolate, Wafer chocolate, Nestle, KitKat,
Chocolate, White chocolate, Nestle, Milkybar,
Chocolate, White chocolate, Nestle, Milkybar,
Chocolate, Caramel chocolate, Nestle, BarOne,
Chocolate, Milk chocolate, Nestle, Nestle Milk chocolate,
Chocolate, Milk chocolate, Nestle, Nestle Milk chocolate,
Chocolate, Milk chocolate, Nestle, Nestle Milk chocolate,
Chocolate, Milk chocolate, Nestle, Nestle Milk chocolate,
Chocolate, Milk chocolate, Cadbury, Dairy milk,
The Parent node would be "Chocolate" and further children would be :-
Chocolate--> Subclass-->Company--->Product. (each of these should be click-expand-collapse)
The size of each node should depend on number of children.
Moreover if you click on a node it should expand/collapse to show its children nodes.
Is there any way I could do this in python. I looked at d3 but its way too complicated to understand. Is there an easier pythonic way to do this in a web-browser interactively ?
解决方案
You can use d3.js to do that. There is a good example to check. You can also use collapse Tree in case you don't wanna use a graph.
Using the script in the tutorial, your example should work like this. If you are not looking to use collaspe/expand structure. You can use d3.js to build a graph, and it would look like this.
root = {
"name": "Chocolate", "tag":"class",
"children": [
{
"name": "Wafer", "tag":"subclass",
"children": [
{
"name": "Nestle", "tag":"company",
"children": [
{"name": "KitKat", "tag":"product"}
]
}
]
},
{
"name": "White", "tag":"subclass",
"children": [
{
"name": "Nestle", "tag":"company",
"children": [
{"name": "Milkybar", "tag":"product"}
]
}
]
},
{
"name": "Caramel", "tag":"subclass",
"children": [
{
"name": "Nestle", "tag":"company",
"children": [
{"name": "BarOne", "tag":"product"}
]
}
]
},
{
"name": "Milk", "tag":"subclass",
"children": [
{
"name": "Nestle", "tag":"company",
"children": [
{"name": "Nestle Milk", "tag":"product"}
]
}, {
"name": "Cadbury", "tag":"company",
"children": [
{"name": "Dairy Milk", "tag":"product"}
]
}
]
}
]
};
1741
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
