Modifying ticksize when resizing the chart - d3.js

Question

I am using the trick of sizing the ticks on my axes in order to render a grid effect on my chart. The problem I have is that I am not able to work out how to resize the ticks on my y axis when the width of the chart changes due to a window resize.
The code that I have to initialize my chart is as follows:
this._xRange = d3.time.scale().range([0, chartWidth]);
this._yRange = d3.scale.linear().range([chartHeight, 0]);
this._xAxis = d3.svg.axis().scale(this._xRange)
.orient("bottom")
.tickSize(-chartHeight)
.tickSubdivide(true);
this._yAxis = d3.svg.axis().scale(this._yRange)
.orient("left")
.tickSize(-chartWidth)
.tickSubdivide(true);
When the chart is resized, I am recalculating the width and height of the chart and attempting to redraw the axes. For the y axis I am using the following code:
// Redraw the y axis
this._yAxis = d3.svg.axis().scale(this._yRange)
.orient("left")
.tickSize(-chartWidth)
.tickSubdivide(true);
this._chart.call(this._yAxis.orient("left"));
This is failing with the following exception in the browser console:
DOMException: Failed to execute 'insertBefore' on 'Node': The node before
which the new node is to be inserted is not a child of this node. "Error:
Failed to execute 'insertBefore' on 'Node': The node before which the new
node is to be inserted is not a child of this node.

Answer 1

I believe that I have hit upon a solution. It appears that I need to remove the existing y axis, create a new generator and then add the new generator to the chart. I am using the following code to do this:
d3.select(".y.ResourceStatsAxis").remove();
this._yAxis = d3.svg.axis().scale(this._yRange)
.orient("left")
.tickSize(-chartWidth)
.tickSubdivide(true);
this._chart.append("g")
.attr("class", "y ResourceStatsAxis")
.call(this._yAxis);