My code includes a function that uses setInterval to generate graphs

Question

My code includes a function that uses setInterval to generate graphs

Is there a way to stop the setInterval function without causing the graph to disappear? I've noticed that when the setInterval stops, the last 7 points plotted on the graph disappear. How can I prevent this from happening? Any suggestions would be greatly appreciated. Thank you!

`

var graphingID = setInterval(function(){
  if (itertn == char.length){
    clearInterval(graphingID);
   }
  itertn++;
   //Add two random numbers for each dataset
  myLiveChart.addData([char[itertn], char[itertn]], ++latestLabel);
  // Remove the first point so we dont just add values forever 
  //updateDaw();
  myLiveChart.removeData(2);
}, 50);

`

javascript angularjs d3.js graph chart.js

Answer 1

Answer №1

Maybe we can try something similar to this code snippet?

let intervalID = setInterval(function(){
  if (counter == characters.length){// Should we stop now? If yes, clear the interval
     clearInterval(intervalID);
   }
  else{// If not, keep going

      counter++;
       // Add two random numbers for each dataset
      myChart.addData([characters[counter], characters[counter]], ++latestLabel);
      // Remove the first point to avoid adding values indefinitely
      //updateView();
      myChart.removeData(2);
 }
}, 50);

Answer 2

Maybe we can try something similar to this code snippet?

let intervalID = setInterval(function(){
  if (counter == characters.length){// Should we stop now? If yes, clear the interval
     clearInterval(intervalID);
   }
  else{// If not, keep going

      counter++;
       // Add two random numbers for each dataset
      myChart.addData([characters[counter], characters[counter]], ++latestLabel);
      // Remove the first point to avoid adding values indefinitely
      //updateView();
      myChart.removeData(2);
 }
}, 50);

Answer 3

Answer №2

Avoid proceeding after clearing:

if (itertn == char.length){ clearInterval(graphingID); return; }

Answer 4

Avoid proceeding after clearing:

if (itertn == char.length){ clearInterval(graphingID); return; }

My code includes a function that uses setInterval to generate graphs

Answer №1

Answer №2

Similar questions

Using jQuery to Iterate Through an AJAX Response

Determine the present vertical measurement of the video

Utilizing Vue.js for Tabs in Laravel 5.8

Setting a timeout from the frontend in the AWS apigClient can be accomplished by adjusting the

The Mantine date picker is causing an error stating that objects are not valid as a React child

mdcolors not displaying correctly within mddialog component in Angular Material

AngularJS ui-router, html5Mode, and Express causing "Cannot GET" error in nested state

Click on the link to go to another page according to the drop-down option selected

AngularJS datetimepicker integrated in the HTML script tag

Passing arguments from an Angular directive to a controller function within an element's HTML

Substitute all instances of null bytes

Only display PHP page content if accessed through an AJAX request, not through directly typing the URL into the address bar

Enhance the functionality of the 'validate as true' function

Is there a way to utilize a JavaScript function to transfer several chosen values from a select listbox to a different listbox when a button is clicked?

Sending an Ajax request to C# code

JQGrid will automatically conceal any row that contains a false value in a given cell

The size of the Webpack bundle grows with each subsequent build

Switching from PHP to JavaScript before returning to PHP to establish and manage sessions

What is the best way to leverage a webbrowser control for design purposes while keeping the functionality in C#?

Oops! Vue.js router configuration is throwing an error because it's unable to read properties of undefined when trying to access 'use'