D3.js nest.map() Function
nest.map() function in D3.js is used to form a nested map. The map contains a key-value pair determined by the key function which was executed very first. If no keys are declared or defined than map function returns the original array as it is.
Syntax:
nest.map(array)
Parameters:
- It takes the collection array as the input.
Return:
Below are a few examples of the above function
Example 1:
When keys are defined.
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport"
content=" width = device -width,
initial-scale = 1 .0">
< title >Document</ title >
</ head >
< style >
.originalColor{
height: 100px;
width: 100px;
}
.darkerColor{
height: 100px;
width: 100px;
}
</ style >
< body >
< script type = "text/javascript"
src =
</ script >
< script >
// Forming the collection
let coll=[
{val:"val10", data:"data11"},
{val:"val20", data:"data22"},
{val:"val30", data:"data33"},
{val:"val40", data:"data44"}
]
let data= d3.nest()
.key(function(d) {
return d.val; })
.map(coll)
// Logging the data
console.log(data);
</ script >
</ body >
</ html >
|
Output:
Example 2:
When no keys are defined.
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport"
content=" width = device -width,
initial-scale = 1 .0">
< title >Document</ title >
</ head >
< style >
.originalColor{
height: 100px;
width: 100px;
}
.darkerColor{
height: 100px;
width: 100px;
}
</ style >
< body >
< script type = "text/javascript"
</ script >
< script >
let collection=[
{val:"val10", data:"data11"},
{val:"val20", data:"data22"},
]
//no keys are defined
let data= d3.nest()
.map(collection)
console.log(data);
</ script >
</ body >
</ html >
|
Output:
Last Updated :
19 Jul, 2020
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...