Bullet Graph (Chart) UI widget

Bullet graph is the most informative way of data presentation. Widget that can be used for comparing the constantly changing value presented in the form of a moving horizontal bar with a static target value. Such visualization allows estimating the ranges of performance (e.g. poor, satisfactory, and good).

live demo

  • Integration: jQuery, Angular, React, Vue.js, Backbone
  • Cross-browser Support (IE8+)
  • Ready for Touch Devices
  • Meets Section 508
  • Quick styling with CSS

Customizable properties

You can define the colors for ranges of performance to simplify the visual analysis, set the value ranges, add text labels and markers, etc.

Animation

The speed of animation can be adjusted by changing the value of the corresponding parameter.

Bullet chart without animation