data-visualization-with-d3/filter.html at main · JavaScriptToday/data-visualization-with-d3 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Data Visualization with D3</title>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/d3/7.9.0/d3.min.js"
      integrity="sha512-vc58qvvBdrDR4etbxMdlTt4GBQk1qjvyORR2nrsPsFPyrs+/u5c3+1Ct6upOgdZoIl7eq6k3a1UPDSNAQi/32A=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    ></script>
  </head>
  <body>
    <script>
      d3.csv('data.csv')
        .then((data) => {
          const filteredData = data.filter((d) => {
            return d.age < 30;
          });

          console.log(filteredData);
        })
        .catch((error) => {
          console.error('Error loading data: ', error);
        });
    </script>
  </body>
</html>