Task 1 is no longer passing when I add a callback function to modify the stroke size based on year.

Question

I am trying to clear the second data binding code interactive section. I'm asked to change the stroke color depending on if the year is 1973 or 1974. I wrote a callback function to do this, but the interpreter isn't liking what I did, saying that it broke prior code (even though it didn't). What is going on? Code attached.

js/app.js

// height and width of the svg
var height = 800, width = 500;

var padding = 50;

var viz = d3.select("#viz-wrapper")
    .append('svg')
    .attr('id', 'viz')
    .attr('height', height)
    .attr('width', width);

d3.csv('app/climate_data_truncated.csv', function(data) {

    dots = viz.selectAll('circle')
        .data(data)
        .enter()
        .append('circle');

    dots.attr('r', function(d) {return Math.abs(d.TMIN) / 10})
        .attr('cx', function(d) {return Math.max(0 + padding, Math.random() * width - padding)})
        .attr('cy', function(d) {return Math.max(0 + padding, Math.random() * height - padding )})
        .style('stroke', function(d){
            if (year = "1973"){
              return "blue"
            }
            else {
              return "red" 
            }
    });
        .style('fill', function(d) {
            year = d.DATE.substring(0,4)
            if (year === "1973") {
                return "blue"
            }
            else {
                return "#ff00f5"
            }
        });
});

index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Requests</title>
  </head>
  <body>
    <div id="viz-wrapper">
    </div>
  </body>
  <script src="js/d3.min.js" charset="utf-8"></script>
  <script src="js/app.js" charset="utf-8"></script>
</html>

Welcome to the Treehouse Community

Looking to learn something new?

Aidan Fleischer

Aidan Fleischer

Task 1 is no longer passing when I add a callback function to modify the stroke size based on year.