score:0
ok, so what pierre capo said was right. i added var packabledata = {id:"parent", values:data};
to the data i am receiving and that will set the parent in the hierarchy when you pass it to d3.hierarchy()
score:1
remember that you want to have a tree. a tree needs to have a root element and every node needs 2 things : an unique id, and a field which links to his parent's id.
for instance, with the data that you have, by adding an id field and assuming that "group" represent the parent node, you can transform your flat data into a hierarchical one :
var data = [
{"id":"0", "group":null, "price":"36599.88", "cy":"44260"},
{"id":"1", "group":"0", "price":"36599.88", "cy":"44260"},
{"id":"2", "group":"0","price":"36599.88", "cy":"44260"},
{"id":"3", "group":"0","price":"36599.88", "cy":"44260"},
{"id":"4", "group":"0","price":"36599.88", "cy":"44260"},
{"id":"5", "group":"1","price":"1241.88", "cy":"44260"},
{"id":"6", "group":"2","price":"36595429.88", "cy":"44260"},
{"id":"7", "group":"3","price":"12124.88", "cy":"44260"},
{"id":"8", "group":"4","price":"6264.88", "cy":"44260"},
];
const tree = d3
.stratify()
.id(d => d.id)
.parentid(d => d.group)(data);
console.log(tree);
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
note that the node with the "group":null
is the root node (by definition a root node is the starting node of your tree, so it doesn't have any parent).
Source: stackoverflow.com
Related Query
- D3.js nest function, cannot get data into hierarchy
- D3: use nest function to turn flat data with parent key into a hierarchy
- D3.js v6.2 - get data index in listener function - selection.on('click', listener)
- How do I get rickshaw to aggregate data into weeks instead of days
- reformatted data into JSON from CSV, can't get parsing right in D3
- trying to get MySQL data into nested json file for d3?
- Cannot get treemap to render with new JSON data
- map function to get radius data from csv for d3 force layout
- Cannot get d3 selection's updated data when key is used
- How to get D3 csv data into a different variable
- Is there a way to get specified data through click event using tooltip function in d3 v6.1.1
- How to get mouseenter function to display data
- Once I put a function into defer() in D3, the data structure inside console.log changed in other function
- get data into correct format to create an area chart
- Using crossfilter with dc.js and d3.js - how to get csv year data into date format?
- How to get data of parent node in d3.js
- How/Where do I get geoJSON data for states, provinces, and administrative regions of non-US countries?
- D3.js: Get an array of the data attached to a selection?
- d3js: make new parent data descend into child nodes
- Cannot import data from csv file in d3
- In d3, how to get the interpolated line data from a SVG line?
- D3.JS get reference to bound data of clicked object
- Calling a function once when data enters in d3
- What object type is the instance element parameter pass into the link function of an angular directive?
- Get data from rest service using D3
- How can I get "call" to execute for each data element in D3?
- Is d3.json() function can get json object?
- Dynamically loading external data from database into d3.js
- NVD3 - How to refresh the data function to product new data on click
- d3.js undefined data value in callback function click event
More Query from same tag
- How can I reference this data in this JSON file?
- D3 chart Y axis line is not visible in some resolutions
- Linear scale inconsistency between x/y and width/height
- Issue with scale module d3 on react
- D3.js trying to implement sortable SVG table
- Is it possible to vary the time interval while the timer is running in d3.js?
- How do you uses nested elements in a force directed D3 graph?
- Dynamically Update Bar Chart in Javascript With Sliders Values
- Issue with D3 Smooth Zoom in of globe on click of plot
- Appending a Line between a start and end date
- Simple line chart joining top of histograms
- Show D3 link text right-side up
- How to create correlogram using D3 as in the example picture
- Gradient along links in D3 Sankey diagram
- Circles keep accumulating and are not merging correctly
- Creating animation to the D3 and SVG elements
- D3 Horizontal Stacked Bar Chart with Lines
- D3 tree and positioning JQuery UI Dialog with nodes
- d3 stacked to grouped bar chart date axis
- D3 time format skips isoWeek
- Load Data and Update Existing View D3
- d3 tree graph zooming is only on node
- D3 manually position nodes with certain ID
- How to load data from an internal JSON array rather than from an external resource / file for a collapsible tree in d3.js?
- Overriding d3 TypeScript definition file
- Position relative is not working in Safari 11 Dagre-d3 svg
- D3 resuable chart: y-axis overwritten
- Using RequireJS to load plotly and D3
- Render graphs in react-native
- Irregular slider in D3