score:0

Accepted answer
  • remove the display:none of the xAxis, no ; at end of css

    .xAxis { display: none;};
    
    .xAxis {}
    
  • add a width attribute to your svg

    var svg = d3.select('body').append('svg').attr('height',height).attr('width', width);
    
  • translate the x-axis

    svg.append('g').attr('transform','translate(0,50)').attr('class', 'xAxis').call(xAxis);
    
  • make the svg bigger and define a height for the bars

    var width = 500;
    var height = 100;
    var heightBar = 50;
    
  • replace many references of height to heightBar

  • fix your input because what you post is not a TSV, and DC has 2 numbers extra (why?)

  • fix the div#dropdown (no close tag) and what is the attribute div

    <div id="dropdown" div style="margin-bottom: 10px;">
    <div id="tooltip" class="hidden">
    </div>
    

Related Query

More Query from same tag