     @getRootElement()
       .select('.margin-convention-element')
       .append('g')
-      .attr('class', 'scale scale-x')
+      .classed(scale: true, 'scale-x': true)
       .attr('transform', "translate(0,#{chartHeight})")
       .call(D3Bar.xAxis(x0Scale))
 

    @getRootElement()
      .select('.margin-convention-element')
      .append('g')
      .attr('class', 'scale scale-y')
      .call(D3Bar.yAxis(yScale))

  renderBars: (data, x0Scale) =>
    @getRootElement()
      .select('.margin-convention-element')
      .append('g')
      .attr('class', 'bar-chart')
      .selectAll('.bars-group')
      .data(data)
      .enter()
      .append('g')
      .attr('class', 'bars-group')
      .attr('transform', (d) -> "translate(#{x0Scale(d.key)},0)")

  renderBar: (chartHeight, x1Scale, yScale) =>

      .data((d, i) -> d.values)
      .enter()
      .append('g')
      .classed('bar-group', true)
      .append('rect')
      .classed('bar', true)
      .attr('x', (d, i) -> x1Scale(i))
      .attr('width', D3Bar.adjustRangeBand(x1Scale.rangeBand()))
      .attr('y', (d, i) -> yScale(d.value))
