用户界面未更新

I am getting data from the database in c# and passing it into Javascript using Ajax. I am storing this data in arrays. I query the database every 3 sec. I am using this data to update my diagram, like changing the color of the track. The simulation works fine till 30 sec, after that my UI(browser) gets stuck and does not get updated. Could you please tell me how to get the simulation running without getting stuck?

Code :

 function getData() {
           $(document).ready(function () {
               var q = setInterval(getData, 3000);
               jQuery.ajax({
                   type: "POST",
                   url: "WebForm1.aspx/GetStations", //It calls our web method  
                   contentType: "application/json; charset=utf-8",
                   data: JSON.stringify({ myArray: dl_id_track }),
                   dataType: "json",
                   async: true,
                   success: function (data) {
                       if (data != null) {
                           var len = data.d.length;                           
                           for (var i = 0; i < len; i++) {
                               signo[i] = data.d[i].signo;
                               status[i] = data.d[i].status;
                             }

                   }
                   simulate();
               },
               error: function (d) {
               }
           });

});

   }



 function simulate() {

           for (var i = 0; i < b.length; i++) {
               for (var j = 0; j < 1024; j++) {
                   //track
                   if (signo[j] == sig_no_track[i]) {
                       if (status[j] == "1") {
                           var x1 = parseInt(left_track[i]) + parseInt(x1_track[i]);
                           var y1 = parseInt(top_track[i]) + parseInt(y1_track[i]);
                           var x2 = parseInt(left_track[i]) + parseInt(x2_track[i]);
                           var y2 = parseInt(top_track[i]) + parseInt(y2_track[i]);
                           var line1 = draw.line([[x1, y1], [x2, y2]]).stroke({ width: 3, color: '#ff0000' });



                }

I only dabble in web-development, so I'm no expert, but since no-one else has responded and I have half-an-idea ...

It looks to me (no expert) like it might recurse, creating an infinite loop ... though perhaps a slowish one due to the setInterval. I'd be inclined to see if it works if you move:

$(document).ready(function () {
    var q = setInterval(getData, 3000);
});

out of the first function and to the end of your <script> block. To test that, you'll need to lose a corresponding }); from the getData function itself.