D3 Examples - Midterm Practice 2

xxxxxxxxxx
 
<!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>
  <script>
    // Feel free to change or delete any of the code you see in this editor!
    var svg = d3.select("body").append("svg")
      .attr("width", 960)
      .attr("height", 500)
​
    svg.append("text")
      .text("Edit the code below to change me!")
      .attr("y", 200)
      .attr("x", 120)
      .attr("font-size", 36)
      .attr("font-family", "monospace")
    
    
    // Problem 1: search array1 for those states whose location is "East"
  // using console.log(), print just the state name(s).
console.log("Question 1: Searching through an Array")
  array1 = [
                    {name: "Arizona",  location: "Southwest"},
            {name: "Virginia", location: "East"},
            {name: "Florida",  location: "Southeast"}
           ];
                array1.forEach(function (a){
            if (a.location == 'East')
              console.log(a.name)
          })
                    console.log("")
  // Problem 1 cont.: search array1 (above) for those states whose location contains the substring "South"
  // using console.log(), print just the state name(s) for these states.
            
         console.log('Problem 1 Cont: Searching through an Array using a Substring') 
          array1.forEach(function (a){
            if (a.location.includes('South'))
              console.log(a.name)
              })
          console.log("")
  // Problem 2: using iteration and console.log(), print those items that are in
  // array2 but NOT in array3
 console.log("Question 2: Using Iteration Printing Items That Are In One Array But Not The Other")   
  array2 = ['a','b','c', 65, 'd'];
  array3 = ['a','c','e','f','g', 87];
    
    array2.forEach (function (x){
      if (array3.includes(x) ){
        return false
        
      }
        console.log (x)
    })
  
    
    
    
    
  console.log("")
  // Problem 3: 'states' is an array of objects. Sort the array in ascending order
  // by state name
  console.log("Question 3: Sorting an Array In Ascending Order By Name")
  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) {
    if (a.name < b.name){
      return -1;
    } if (a.name > b.name){
      return 1;
    } 
  });   console.log(states)
  
  console.log('')
  //Another Way to sort by their names.
    
  console.log("Question 3 Second Solution:")
  states.sort(function(a,b){
            return d3.ascending(a.name, b.name) })
    console.log(states)
  
            console.log("")
  // Problem 4: write code that determines which state(s) have a population value that is an even number. Print out the state(s) to the console
        console.log("Question 4: Determing Which State has an Even Population")
            
     states.forEach(function (i){
      if ( i.population % 2 == 0){
        console.log(i)
      }
    })
    
     console.log('')
     
     console.log('Computing Means with Different Methods:')
     
     console.log('')
     
     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}]
            
  // Problem 1: using d3.mean(), compute and print the average (mean) 
  // population of the states in the states array
  
   console.log('Question : 1 "d3.mean" Solution')
    
  var population_mean = d3.mean(states, function(i){
    return i.population;
    
  })
 
  console.log(population_mean)
  
  // Problem 2: WITHOUT using d3.mean(), compute and print the average (mean) 
  // population of the states in the states array
  
  console.log('Question : 2 "for" Solution')
  
  var average = 0;
  for(i = 0; i < states.length; i++){
      average += states[i].population;
  }
  average = average / states.length;
  
  console.log(average)
  
  
  //How to do Question 2 with a forEach loop:
  
  console.log('Question : 2 "forEach" Solution')
  
  var populations = 0;
  
  states.forEach(function (d){
    populations += d.population;    
  })
  
    var mean = populations / states.length;
  console.log(mean)
  
  
  
  // How to do Question 2 with a while loop 
  
  console.log('Question : 2 "while" Solution')
  
  var population = 0;
  var mean2 = 0;
  var i = 0;
  
  while(i < states.length) {
    
    population += states[i].population;
    i++;   
  
  }
   
   mean2 = population / states.length
   console.log(mean2)
     
    
    
​
  </script>
</body>
​
    