D3.js | color.toString() Function

0 1 1 minute read

The color.toString() function in D3.js is used to return a string representing the color according to the CSS Object Model specification. Syntax:

color.toString()

Parameters: This function does not accept any parameters. Return Value: This function returns a string representing the color according to the CSS Object Model specification. Below programs illustrate the color.toString() function in D3.js: Example 1:

javascript

<!DOCTYPE html>
<html>
 
<head>
    <title>color.toString() function</title>
 
    <script src='https://d3js.org/d3.v4.min.js'></script>
</head>
 
<body>
    <script>
         
        // Calling the d3.color() function function
        // with some parameters
        var color1 = d3.color("red");
        var color2 = d3.color("green");
        var color3 = d3.color("blue");
         
        // Calling the color.toString() function
        var A = color1.toString();
        var B = color2.toString();
        var C = color3.toString();
         
        // Getting the string representing
        console.log(A);
        console.log(B);
        console.log(C);
    </script>
</body>
 
</html>

Output:

rgb(255, 0, 0)
rgb(0, 128, 0)
rgb(0, 0, 255)

Example 2:

javascript

<!DOCTYPE html>
<html>
 
<head>
    <title>color.toString() function</title>
 
    <script src='https://d3js.org/d3.v4.min.js'></script>
</head>
 
<body>
    <script>
         
        // Calling the d3.rgb() function
        // without some parameters
        var color = d3.rgb();
         
        // Calling the color.toString() function
        var A = color.toString();
         
        // Getting the string representing
        console.log(A);
    </script>
</body>
 
</html>

Output:

rgb(0, 0, 0)

Reference: https://devdocs.io/d3~5/d3-color#color_toString

Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, zambiatek 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!