Skip to content

Instantly share code, notes, and snippets.

@denisemauldin

denisemauldin/.block

Last active April 4, 2018 16:02
Show Gist options
  • Save denisemauldin/9090e02547057215a91bdc3f5192decf to your computer and use it in GitHub Desktop.
Save denisemauldin/9090e02547057215a91bdc3f5192decf to your computer and use it in GitHub Desktop.
Download ZIP
nested text
Raw
.block
license: mit
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v4.min.js"></script>
<style>
body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
</style>
</head>
<body>
<script>
function makeNestedListItems (parentLists) {
var item = parentLists.append('li')
.text(function (d) { return d.key; });
var children = parentLists.selectAll('ul')
.data(function (d) {
return d.children
})
.enter().append('ul');
if (!children.empty()) {
makeNestedListItems(children);
}
}
var data_lowest = [
{key:"Key1", values:["1a","1b","1c"], "children": []},
{key:"Key2", values:["2a","2b","2c"],
"children": [
{key:"Key21", values:["21a","21b","21c"]},
{key:"Key22", values:["22a","22b","22c"]},
]
},
{key:"Key3", values:["3a","3b","3c"], "children": []},
{key:"Key4", values:["4a","4b","4c"],
"children": [
{key:"Key41", values:["41a","41b","41c"]}
]
}
];
console.log(data_lowest)
var rootList = d3.select('body').selectAll('ul').data(data_lowest)
.enter().append('ul');
makeNestedListItems(rootList);
</script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment