Vehicle Tracking on Realtime Maps

1.js

var drivers = [
  { latlng: [30.370375, -97.756138] },
  { latlng: [30.323118, -97.739144] },
  { latlng: [30.302816, -97.699490] },
  { latlng: [30.293479, -97.742405] },
  { latlng: [30.250337, -97.754593] },
  { latlng: [30.236689, -97.762730] }
];

2.html

<script type="text/javascript" src="//pubnub.github.io/eon/v/eon/1.0.0/eon.js"></script>
<link type="text/css" rel="stylesheet" href="//pubnub.github.io/eon/v/eon/1.0.0/eon.css"/>
<script>
  var pubnub = new PubNub({
    publishKey: 'demo',
    subscribeKey: 'demo'
  });
  var map = eon.map({
    id: 'map',
    mbId: 'YOUR_MAPBOX_ID',
    mbToken: 'YOUR_MAPBOX_TOKEN',
    channels: ['eon-map-multiple'],
    pubnub: pubnub,
    message: function (data) {
      map.setView(data[3].latlng, 13);
    }
  });
  //////////////
  function init() {
    var point = {
      latlng: [37.370375, -97.756138]
    };
    var pubnub = new PubNub({
      publishKey: 'demo',
      subscribeKey: 'demo'
    });
    setInterval(function(){
      var new_point = JSON.parse(JSON.stringify(point));
      new_point.latlng = [
        new_point.latlng[0] + (getNonZeroRandomNumber() * 0.1),
        new_point.latlng[1] + (getNonZeroRandomNumber() * 0.2)
      ];     
      pubnub.publish({
        channel: 'eon-map-multiple',
        message:[new_point]
      });
    }, 500);
  };
</script>