Examples of using the Spark font for creating charts in text

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.

That chart above is created using the font Spark: each bar of the chart is actually a number.

The font to turn it into a chart needs to be stored in the same place as the CSS file.

Using other chart fonts

Here's the same sentence again but using a different font (and class attribute) to create a different chart. Notice that it doesn't work properly because the numbers aren't kept within the range 0-9 (the numbers are {4,0,0,0,6,29,70})

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.

Here it is again but with the numbers changed to {1,0,0,0,1,3,7}:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {1,0,0,0,1,3,7} 70. There have been 33 incidents up to May 2017.

Note that anything within curly brackets is turned into a bar or line or dot, depending on the font. But the year numbers either side are rendered as normal numbers, because they are outside the curly brackets. Text characters, however, won't render properly.

And the rest

Now for the medium dot chart. This one uses the same 0-100 range as the bar chart, so the original figures {4,0,0,0,6,29,70} work fine:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.

With the numbers changed to {1,0,0,0,1,3,7} the difference is too small to be meaningful:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 2010 {1,0,0,0,1,3,7} 2016. There have been 33 incidents up to May 2017.

Now for the small dot chart:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.

Then the narrow bar chart:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.

And the thin bar chart:

There were 70 Airprox reports involving drones coming close to aircraft over the UK in 2016 - compared to 29 in 2015 and just 4 in 2010 4 {4,0,0,0,6,29,70} 70. There have been 33 incidents up to May 2017.