Classic D3 Examples
Old school D3 from simpler times
scampbell2434
Full window
Github gist
fresh block
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style> </head> <body> <h1>Please look in the code below for 5 JavaScript practice problems.</h1> <p>(These problems don't include any SVG manipulation, so you will need to open the developer console in order to see the output of your code)</p> <script> // Problem 1: modify array1 so that each object it contains includes the 2 letter state "id" array1 = [ {name: "Arizona", location: "Southwest"}, {name: "Virginia", location: "East"}, {name: "Florida", location: "Southeast"} ]; array2 = [ {name: "Virginia", id: "VA"}, {name: "Arizona", id: "AZ"}, {name: "Florida", id: "FL"} ]; array1.forEach(function(a1) { array2.forEach(function(a2) { if (a1.name == a2.name) { a2.id = a1.id; } }) }) // Problem 2: print all items that are in both array3 // and array4 to the console. array3 = ['a','b','c','d']; array4 = ['a','c','e','f','g']; // console.log("first solution:") array3.forEach(function (a3) { array4.forEach(function (a4) { if (a3 == a4) { // console.log(a3) } }) }) // console.log("second solution:") array3.forEach(function (a3) { if (array4.includes(a3)) { // console.log(a3); } }) // Problem 3: 'states' is an array of objects. Sort the array in ascending order by population states = [{name: "Alaska", id: "AK", population: 741894}, {name: "Virginia", id: "VA", population: 8411808}, {name: "Arizona", id: "AZ", population: 6931071}, {name: "Florida", id: "FL", population: 20984400}] states.sort(function (a,b){ return a.population - b.population}) // Problem 4: using console.log() and the appropriate index on the sorted 'states' array, print the state with the smallest population. console.log // someNumbers is an array containing all integers from 1-10 inclusively someNumbers = d3.range(1,11) // Problem 5: using console.log(), a loop,and the modulus operator, print those members of someNumbers that are NOT multiples of 3. </script> </body>
https://d3js.org/d3.v4.min.js