Create a zoomable arc in d3?

[j.zamani]

I am following the example from Click Here The circles drawn in the example increase in size when zoomed-in by click event. Is there any way to create zoomable arc with the same effect.Here is my source code. please let me know how can I do this :

var w = 1200,
    h = 780;
var svgContainer = d3.select(".Body").append("svg")
  .attr("width", w).attr("height", h).attr("class", "svgBody");
var arc = d3.svg.arc().innerRadius(90).outerRadius(150)
  .startAngle(0.5 * Math.PI).endAngle(1.5 * Math.PI);
var arcpath = svgContainer.attr("id", "arc").append("path").attr("d", arc)
  .attr("transform", "translate(600,0)").style("fill", "#8b0000")
  .on("click", function(d) {
    var pathsize = this.getBBox();
    zoom(d, pathsize), d3.event.stopPropagation();
  });

var view;
function zoom(d, _patsize) {
  console.log(_patsize.x + "  " + _patsize.y + "  " + _patsize.width);
  var transition = d3.transition().duration(d3.event.altKey ? 7500 : 750)
    .tween("zoom", function(d) {

      var i = d3.interpolateZoom(view, [_patsize.x, _patsize.y, _patsize.width]);
      return function(t) {
        zoomTo(i(t));
      };
    });

  function zoomTo(v) {
    var k = w / v[2];
    view = v;
    arcpath.attr("transform", function(d) {
      return "translate(" + (d.x - v[0]) * k + "," + (d.y - v[1]) * k + ")";
    });
    node.attr("width", function(d) {
      return d.width * k;
    });
  }
}

I couldn't set the view, please let me know what is the view?