Delay function order

1

Why this code works properly?

i assume it is processed like:
first append ‘g’, then do transition and after that call delay, cause it is called after first one?
this is d3.js here is pen: [ http://codepen.io/ustvarno/pen/KrkJvB?editors=0010 ]

canvas.append('g')
  .transition()
  .duration(1000)
  .delay(500)
  .attr("transform", function(){return "translate(10,"+ (barsWidths.length * nodeHeight * 1.25) + ")" })
  .call(d3.axisBottom(scaleBars).ticks(5));