D3.js selection.empty() Function

Last Updated : 14 Aug, 2020

The d3.empty() function in D3.js is used to return a boolean value. The value is true when the selection contains no elements and it returns false when the selection is non-empty.

Syntax:

selection.empty();

Parameters: This function takes no parameters.

Return Values: This function returns a boolean value.

Below given are a few examples of the function given above.

Example 1:

html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport"
            path1tent="width=device-width, 
                    initial-scale=1.0"> 
    <title>Document</title> 
</head> 
<style> 
div{
    background-color: green;
    margin-bottom: 5px;
    padding: 10px;
    width: fit-content;
}
</style> 
<body>  
    <div>Some text</div>
    <div>Geeks for geeks</div>
    <div>Geeks for geeks</div>
    <div>Some text</div>
  <script src = 
"https://d3js.org/d3.v4.min.js"> 
  </script>
  <script src=
  "https://d3js.org/d3-selection.v1.min.js">
</script>
  <script>
      let selection=d3.selectAll("div")
      console.log(selection.empty())
  </script> 
</body> 
</html>

Output:

Example 2:

html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <meta name="viewport"
            path1tent="width=device-width, 
                    initial-scale=1.0"> 
    <title>Document</title> 
</head> 
<style> 
div{
    background-color: green;
    margin-bottom: 5px;
    padding: 10px;
    width: fit-content;
}
</style> 
<body>  
    <div>Some text</div>
    <div>Geeks for geeks</div>
    <div>Geeks for geeks</div>
    <div>Some text</div>
  <script src = 
"https://d3js.org/d3.v4.min.js"> 
  </script>
  <script src=
  "https://d3js.org/d3-selection.v1.min.js">
</script>
  <script>
    // Selection is empty because no
    // container name h2 is rendered.
      let selection=d3.selectAll("h2")
      console.log(selection.empty())
  </script> 
</body> 
</html>

Output:

T

tarun007

Improve

Article Tags :

Similar Reads

D3.js selection.each() Function

The selection.each() function in D3.js is used to call the particular function for each selected HTML elements. In function datum(d) and index(i) are given as the parameters. By using this method one can access parent and child data simultaneously. Syntax: selection.each(callback); Parameters: This

D3.js selection.filter() Function

The d3.selection.filter() function in d3.js is used to filter the given selection and return a new selection for which the filter is true. The filter to be used may be a string or a function. Syntax: selection.filter(filter); Parameters: This function accepts one parameter as mentioned above and des

D3.js selection.append() Function

The selection.append() function is used to append a new element to the HTML tag name as given in the parameters to the end of the element. If the type that is given is a function then it must be evaluated for each element that is in the selection. Syntax: selection.append(type); Parameters: This fun

D3.js selection.classed() Function

The selection.classed() function is used to set the class to the selected element. This function can also be used to unset the class to a particular element that is selected. Syntax: selection.classed(names[, value]); Parameters: The above-given function takes two parameters which are given above an

D3.js selection.remove() Function

The selection.remove() function is used to remove the selected elements from the document and return a new selection with the removed elements. Also, new selection are now detached from the DOM Syntax: selection.remove(); Parameters: This function does not accept any parameters. Return Values: This

D3.js selection.node() Function

The selection.node() function in D3.js is used to return the first element in the selection. If the selection does not contain any elements then it returns null. Syntax: selection.node() Parameters: This function does not accept any parameters. Return Values: This function returns the first element

D3.js selection.text() Function

The selection.text() function in d3.js is used to set the text content to the specified value of the selected elements thus, it replaces any existing child elements. If the value that is given is constant than all elements will be given that constant value. Syntax: selection.text([value]); Parameter

D3.js selection.insert() Function

The selection.insert() function is used to append a new element of the given type at the specified position. It inserts a new element before the selector for each selected element. Syntax: selection.insert(type[, before]); Parameters: This function takes two parameters which are given above and desc

D3.js selection.attr() Function

The selection.attr() function is used to set the attribute of the element that is selected. The name of the attribute and value of the attributes are to be set using this function. Syntax: selection.attr(name[, value]); Parameters: This function takes two parameters as shown above and described belo

D3.js selection.enter() Function

The d3.selection.enter() function in D3.js is used to create the missing elements and return the enter selection. Syntax: selection.enter(); Parameters: This function does not accept any parameter. Return Values: This function returns the enter selection. Below examples illustrate the D3.js selectio