D3 gauge pointer tranistion

[Newbie]

Hi, 

I'm having the following issue:

I have an angular directive which set a d3 gauge. Adding the elment is done on the postLink function of the directive.

Now i'm trying to set the gauge pointer on a certain start angle and then move it to another (no event fires that, that what should happen once the gauge is diplayed).

That is, the following code on the post link function won't work:

var pointerLine = d3.svg.line().interpolate('monotone');

var pg = svg.append('g').data([lineData])

.attr('class', 'pointer')

.attr('transform', centerTx);

                                              

var pointer = pg.append('path')

.attr('d', pointerLine)

.attr('transform', 'rotate(' +config.minAngle+')');

                

                

                var ratio = scale(result);

var newAngle = config.minAngle + (ratio * range);

pointer.transition()

.duration(config.transitionMs)

//.ease('elastic')

.attr('transform', 'rotate(' +newAngle +')');

I believe the transition is premature and should be done only after the 

Would you agree with me on that, and where should the transition code be placed so it can actually take place.

!!thanks