NavData on parrot 2.0 ardrone, how to add delay and build real time graph?

i want ask something. i want give delay to navData read on parrot AR Drone 2.0. can you give example how to add interval to my Navdata read? and what i need to do, if i want build real time graph, can someone give tutorial link ?

var arDrone = require('ar-drone'); 

var client = new arDrone.createClient();
client.on('navdata', function(d){

if(d.demo){
    console.log('Roll:' + d.demo.rotation.roll);
}
});

or this code?

    var arDrone = require('ar-drone');
var droneClient = arDrone.createClient();
droneClient.config('general:navdata_demo', 'TRUE');

droneClient.on('navdata', function(navdata) {
try {
    console.log('test:' + navdata.demo.batteryPercentage);
}
catch(err) {
    console.log(err.message);
}
});

You can't really change the rate at which navdata comes in. You can just ignore navdata if you don't want to process it. The code below only processes navdata once per second:

var lastNavDataMs = 0;

client.on('navdata', function(d) {
  var nowMs = new Date().getTime();
  if (nowMs - lastNavDataMs > 1000) {
    lastNavDataMs = nowMs;
    // Process navdata once per second.
    if (d.demo){
      console.log('pitch:' + d.demo.rotation.roll);
    }
  }
});

For displaying a realtime graph of sensor values, you might try the Smoothie Charts library. It's specifically intended to handle charts and graphs with realtime updating. Their tutorial makes it look very easy. Below, I've tried to adapt their tutorial to showing navdata information from the AR.Drone. I haven't tested it, but it might be a good starting point.

First, in your HTML, include the Smoothie script and create a canvas element to hold the graphs:

<script type="text/javascript" src="smoothie.js"></script>
<canvas id="mycanvas" width="400" height="100"></canvas>

The code:

var arDrone = require('ar-drone'); 
var smoothie = new SmoothieChart();
smoothie.streamTo(document.getElementById("mycanvas"));

// Lines on the chart.
var rollLine = new TimeSeries();
var altitudeLine = new TimeSeries();

var client = new arDrone.createClient();
client.on('navdata', function(d) {
  if (d.demo) {
    // Add new measurements for roll and altitude.
    var time = new Date().getTime();
    rollLine.append(time, d.demo.rotation.roll);
    altitudeLine.append(time, d.demo.altitudeMeters);
  }
});

// Add the lines to our chart.
smoothie.addTimeSeries(rollLine);
smoothie.addTimeSeries(altitudeLine);