The geoArmadillo() function in d3.js is used to draw the Armadillo projection of the given geojson data. It is a map projection used for world maps that can be used for showing most of the globe instead of the limited view of a perspective. It is neither conformal nor equal-area. The center assumes a parallel of 20° by default and can be changed if a different parallel is being used.
Syntax:
d3.geoArmadillo()
Parameters: This method does not accept any parameters.
Return Value: This method returns the Armadillo projection.
Example 1: The following example draws the Armadillo projection of the world.
HTML
<!DOCTYPE html> <html>   <head>     <script src=     </script>     <script src=     </script> </head>   <body>     <div style="width:700px; height:700px;">         <center>             <h3 style="color:green">                 Armadillo Projection of World             </h3>         </center>         <svg width="700" height="350">         </svg>     </div>           <script>         var svg = d3.select("svg"),             width = +svg.attr("width"),             height = +svg.attr("height");           // Armadillo projection         var gfg = d3.geoArmadillo()             .scale(width / 1.5 / Math.PI)             .translate([width / 2, height / 2]);           // Loading the json data         d3.json("https://raw.githubusercontent.com/" +             "janasayantan/datageojson/master/" +             "geoworld%20.json",             function (data) {                   // Draw the map                 svg.append("g")                     .selectAll("path")                     .data(data.features)                     .enter().append("path")                     .attr("fill", "blue")                     .attr("d", d3.geoPath()                         .projection(gfg)                     )                     .style("stroke", "#ffff")             });     </script> </body>   </html> |
Output:
Example 2: The following example draws the Armadillo projection of Asia.
HTML
<!DOCTYPE html> <html>   <head>     </script>     <script src=     </script> </head>   <body>     <div style="width:500px; height:700px;">         <center>             <h3 style="color:green">                 Armadillo Projection of Asia             </h3>         </center>         <svg width="600" height="350">         </svg>     </div>     <script>         var svg = d3.select("svg"),             width = +svg.attr("width"),             height = +svg.attr("height");           // Armadillo projection         var gfg = d3.geoArmadillo()             .scale(width / 1.5 / Math.PI)             .center([100, 0])             .translate([width / 2, height / 2]);           // Loading the geojson data         d3.json("https://raw.githubusercontent.com/" +             "janasayantan/datageojson/master/" +             "geoasia.json",             function (data) {                   // Draw the map                 svg.append("g")                     .selectAll("path")                     .data(data.features)                     .enter().append("path")                     .attr("fill", "grey")                     .attr("d", d3.geoPath()                         .projection(gfg)                     )                     .style("stroke", "#ffff");             })     </script> </body>   </html> |
Output:
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!
