Update the Height of an Element Dynamically [Data Visualization with D3]

Update the Height of an Element Dynamically [Data Visualization with D3]


Tell us what’s happening:

I’ve done as the exercise asks, and the output draws/renders the image as expected… But none of the tests pass. Anyone able to get this working? Do I have errors that need to be addressed or is there more that should be in there?

Your code so far

  .bar {
    width: 25px;
    height: 100px;
    display: inline-block;
    background-color: blue;
    const dataset = [12, 31, 22, 17, 25, 18, 29, 14, 9];
      .attr("class", "bar")
      // Add your code below this line
      .style("height", (d) => d+"px");

      // Add your code above this line

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.79 Safari/537.36.

Link to the challenge:


Mine failed using Chrome but passed when I used Firefox


Mine too. Fails on Chrome works on Firefox.

It is usually the other way around…


Agreeing with others- this lesson will pass on Firefox but not Chrome


Weird, mine passed in Chrome.


Itd be nice if they posted some sort of disclaimer warning us that correct solutions may not pass in some browsers. Seems like a pretty minimal feature that would save a lot of us some time and energy thats being uselessly wasted.


use this: .style(“height”, (d) => (d + “px”));
or : .style(“height”, (d) => {return d + “px”});