Real-time Charts and Gauges

Real-time charts and gauges can automatically update themselves at the specified period of time by getting new data from server without involving any page refreshes. They are highly useful in network monitoring applications, stock/finance monitoring applications and manufacturing process indicators where the most up-to-date data has to be displayed.

Shown below is a real-time stock price monitor that updates itself every 3 seconds.


FusionCharts offers 6 real-time charts:

  • Real-time Area
  • Real-time Column
  • Real-time Line
  • Real-time Stacked Area
  • Real-time Stacked Column
  • Real-time Line (Dual Y-axis)

In these charts, the latest data is shown along with the historical data for the pre-defined period like in the stock price monitor above. Whenever new data comes in, it is displayed on the rightmost and the oldest data set is pushed out of the chart from the leftmost. As a result, these real-time charts are also called data streaming charts.

FusionCharts offers 7 real-time gauges:

  • Real-time Angular
  • Real-time Bulb
  • Real-time Cylinder
  • Real-time Horizontal LED
  • Real-time Horizontal Linear
  • Real-time Thermometer
  • Real-time Vertical LED

In these gauges, unlike the real-time charts, only the latest value(s) is displayed and the older ones are over-written. These are useful when you're just concerned with the current value of the monitored device, without any consideration for any historical values. For example, when you're monitoring temperature of a particular device, you are only interested in the current temperature.

The real-time charts support the following features:

  • Update multiple datasets in real-time.
  • Update multiple values in each update interval.
  • Ability to set different update and refresh interval. Update interval fetches the new data but doesn't change the view of chart. Only on Refresh interval the updated data will be applied on chart's view.
  • Message Logger.
  • Alert Manager.
  • Annotations to render custom objects.
  • FusionCharts Style support.
  • JavaScript API to set data, retrieve data, start/stop updates, clear chart.
  • JavaScript events can be raised when chart is initialized/rendered and data is updated.
  • Ability to clear chart & stop update from server.
  • Interactive legend to show/hide datasets in line/area charts.
  • Real-time vLine & trend-lines supported.
  • Context menu to help users enable/disable real-time updates.
  • Advanced number formatting support.
  • Pre-defined and automatic color palette support.