I have a d3.js half donut chart showing a progress in %, like this:

The chart gets the json data from a php script with jQuery getJSON function. What I would like is to update the chart every minute, but without having to do a setInterval on the whole script. Is it possible just to replace the chart data every minute?

My chart script:

var w           = 300,
    h           = 300,
    outerRadius = (w / 2) - 10,
    innerRadius = 85;
    
var percent = Math.round(json.bhp * 100);

var ratio = percent / 100;

var pie = d3.layout.pie()
    .value(function(d){return d})
    .sort(null);                    

var color    = ['#ececec','#f6c717','#888888'],
    colorOld = '#F00',
    colorNew = '#f6c717';

var arc = d3.svg.arc()
    .innerRadius(innerRadius)
    .outerRadius(outerRadius)
    .startAngle(0)
    .endAngle(Math.PI);

var arcLine = d3.svg.arc()
    .innerRadius(innerRadius)
    .outerRadius(outerRadius)
    .startAngle(0);

var svg = d3.select('#bhp')
    .append('svg')
    .attr({
        width :w,
        height:160,
    })
    .append('g')
    .attr({
        transform:'translate('+w/2+','+h/2+')'
    });

var path = svg.append('path')
    .attr({
        d        :arc,
        transform:'rotate(-90)'
    })
    .attr({
        'stroke-width':"1",
        stroke        :"#666666"
    })
    .style({
        fill:color[0]
    });

var pathForeground = svg.append('path')
    .datum({endAngle:0})
    .attr({
        d        :arcLine,
        transform:'rotate(-90)'
    })
    .style({
        fill: function (d, i) {
            return color[1];
        }
    });

var middleCount_bhp = svg.append('text')
    .datum(0)
    .text(function(d){
        return d;
    })
    .attr({
        class        :'middleText',
        'text-anchor':'middle',
        dy           :0,
        dx           :5
    })
    .style({
        fill       :d3.rgb('#000000'),
        'font-size':'60px'
    });

var oldValue = 0;
var arcTween = function(transition, newValue, oldValue) {
    transition.attrTween('d', function (d) {
        var interpolate = d3.interpolate(d.endAngle, ((Math.PI)) * (newValue / 100));

        var interpolateCount = d3.interpolate(oldValue, newValue);

        return function (t) {
            d.endAngle = interpolate(t);
            middleCount_bhp.text(Math.floor(interpolateCount(t)) + '%');

            return arcLine(d);
        };
    });
};

pathForeground.transition()
    .delay(200)
    .duration(750)
    .ease('cubic')
    .call(arcTween, percent, oldValue);