Thursday, September 18, 2025
HomeLanguagesJavascriptD3.js | d3.cross() function

D3.js | d3.cross() function

The d3.cross() function in D3.js is used to return the cartesian product of the given two arrays A and B.

Syntax:

d3.cross(Array1, Array2)

Parameters: This function accepts two parameters which are mentioned above and described below:

  • Array1: This is the first array whose elements are going to be performed cartesian product with array2.
  • Array2: This is the second array whose elements are going to be performed cartesian product with array1.

Return Value: It returns the cartesian product array of two-element each of two given array.

Below programs illustrate the d3.cross() function in D3.js.
Example 1:




<html>
  
<head>
    <title>
      Getting cartesian product
      of the two given array
  </title>
</head>
  
<body>
    <script src='https://d3js.org/d3.v4.min.js'>
  </script>
  
    <script>
        // initialising the array of elements
        var Array1 = [10, 20, 30];
        var Array2 = [1, 2, 3];
  
        // Calling to d3.cross() function
        A = d3.cross(Array1, Array2);
  
        // Getting cartesian product of the two given array
        document.write(A + "<br>");
    </script>
</body>
  
</html>


Output:

[[10, 1], [10, 2], [10, 3], [20, 1], [20, 2], [20, 3], [30, 1], [30, 2], [30, 3]]

Example 2:




<html>
  
<head>
    <title>
      Getting cartesian product 
      of the two given array
  </title>
</head>
  
<body>
    <script src='https://d3js.org/d3.v4.min.js'>
  </script>
  
    <script>
        // initialising the array of elements
        var Array1 = ["A", "B", "C"];
        var Array2 = ["a", "b", "c"];
  
        // Calling to d3.cross() function
        A = d3.cross(Array1, Array2);
  
        // Getting cartesian product of the two given array
        document.write(A + "<br>");
    </script>
</body>
  
</html>


Output:

[[A, a], [A, b], [A, c], [B, a], [B, b], [B, c], [C, a], [C, b], [C, c]]

Ref: https://devdocs.io/d3~4/d3-array#cross

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
RELATED ARTICLES

Most Popular

Dominic
32299 POSTS0 COMMENTS
Milvus
84 POSTS0 COMMENTS
Nango Kala
6660 POSTS0 COMMENTS
Nicole Veronica
11835 POSTS0 COMMENTS
Nokonwaba Nkukhwana
11895 POSTS0 COMMENTS
Shaida Kate Naidoo
6779 POSTS0 COMMENTS
Ted Musemwa
7053 POSTS0 COMMENTS
Thapelo Manthata
6735 POSTS0 COMMENTS
Umr Jansen
6741 POSTS0 COMMENTS