In this tutorial, you’ll learn how to draw a Bullet Graph in Glimpse to visualize performance metric data.
Open the Data Grid from the bottom of the window and add the data from the table below:
|Measure||Measure Value||Rating||Rating Range||Target|
Next, go to the Inspector panel > Visual > Mark and set the Mark Type to Bar.
Now, from the left side under Fields, drag the Rating Range field into the X encoding and switch off the Title toggle in the Inspector panel. The Inspector panel is to the right side of the window.
Next, drag the Measure field into the Y encoding and deactivate Title in the Inspector panel.
Then, drag the field Rating into the Color encoding. You should now see different colors of the rating range to the right side of the graph for Bad, Good, and Great.
You can now change each color. Go to the Inspector panel and open the Visual section. Then, in the Encoding tab open the Scale dropdown and > Range, press the + button 3 times, one time for each color. A color picker will pop up for each color. That’s where you can change each shade. Enter 3 shades of grey (or any other color) of decreasing darkness.
To adjust the height of the chart, go to the Visual section of the Inspector, click on the Layer tab. Then, under the Layout dropdown set the Height to 100 pt.
You will now create a new layer for the Measure feature. From the top menu, choose Insert > Layer > Bar.
Then, drag the field Measure Value into the X encoding and Measure into the Y encoding.
To adjust the appearance of the Measure feature, go to Visual > Mark > Size in the Inspector panel and enter 30 pt in the Height field under Size.
After, change the Color to black.
To add the ‘comparative measure’, from the top menu go Insert > Layer > Tick.
Drag the field Target into the X encoding.
To make the comparative measure larger, go to the Visual section of the Inspector panel. Then, go to Mark > Size and set the Size to 7 pt.
To make the comparative measure more visible, set the Color to black and under Stroke set the Thickness to 4 pt.
Done! This concludes this tutorial on drawing a Bullet Graph. If you want to further customize your chart, please read the documentation.