Bullet chart

A bullet graph is a variation of a bar graph. The bullet series features a single measure, compares it to a target, and displays it in the context of qualitative ranges of performance, that could be set using plotBands  on yAxis.

For more detailed samples and documentation check the API. 

Click here  to check the code.

How to create a bullet chart

Bullet series requires the following module “modules/bullet.js”.

To create a bullet series, add the following configuration in the series option:

{
    type : 'bullet',
    data : [{
        y : 20,     // The value of a point
        target: 50  // The target value of a point
    }],
    targetOptions: { // Options related with look and position of targets
        width: '140%',        // The width of the target
        height: 3,            // The height of the target
        borderWidth: 0,       // The border width of the target
        borderColor: 'black', // The border color of the target
        color: 'black'        // The color of the target
    }
}

The targetOptions could be set for each point to create individual target options. On point level and even on series level the targetOptions are optional - default options will be set. The default options values can be found in the API reference .