<commit_before># d3gauge

**d3gauge.js** is an add-in for the [D3](http://d3js.org) javascript library for drawing gauges, based on the [google charts gauge](https://developers.google.com/chart/interactive/docs/gallery/gauge) and [this javascript implementation](http://tomerdoron.blogspot.nl/2011/12/google-style-gauges-using-d3js.html). Every aspect of a d3gauge (sizes, colours, fonts) can be customised by passing an object containing options (see below).  

The gauge values can be easily updated, and the needle moves with an 'rubber-band' effect.  The gauge is a javascript object, so it is possible to have multiple gauges in one document.

Styles are set by inline style arguments, rather than CSS classes so that (i) multiple gauges can have different styles and (ii) svg gauges can be saved as images using tools like [canvg](https://github.com/gabelerner/canvg)

![Example gauge](https://github.com/oliverbinns/d3gauge/blob/master/docs/example.png "Example gauge")

I have written a more detailed post on how the code works on my blog, [here](http://oliverbinns.com/articles/D3js-gauge/), which includes a live example. There is a also a guide to rasterising the gauge as a png file in the browser [here](http://oliverbinns.com/articles/rasterising-SVG-in-the-browser/).

## Usage
Add the d3gauge.js script to your site, along with the latest version of d3:
```
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript" src="d3gauge.js" charset="utf-8"></script>
```<commit_msg>Updating readme to describe update to version 4/5<commit_after># d3gauge

**d3gauge.js** is an add-in for the [D3](http://d3js.org) javascript library for drawing gauges, based on the [google charts gauge](https://developers.google.com/chart/interactive/docs/gallery/gauge) and [this javascript implementation](http://tomerdoron.blogspot.nl/2011/12/google-style-gauges-using-d3js.html). Every aspect of a d3gauge (sizes, colours, fonts) can be customised by passing an object containing options (see below).  

The gauge values can be easily updated, and the needle moves with an 'rubber-band' effect.  The gauge is a javascript object, so it is possible to have multiple gauges in one document.

Styles are set by inline style arguments, rather than CSS classes so that (i) multiple gauges can have different styles and (ii) svg gauges can be saved as images using tools like [canvg](https://github.com/gabelerner/canvg)

![Example gauge](https://github.com/oliverbinns/d3gauge/blob/master/docs/example.png "Example gauge")

I have written a more detailed post on how the code works on my blog, [here](http://oliverbinns.com/articles/D3js-gauge/), which includes a live example. There is a also a guide to rasterising the gauge as a png file in the browser [here](http://oliverbinns.com/articles/rasterising-SVG-in-the-browser/).

## Requirements
The current version of d3gauge works with d3 version 4 and 5.  If you need a version that works with d3 version 3 see commit 02d57bcbc5d10bfe853663c9f0b1442d5f63d265

## Usage
Add the d3gauge.js script to your site, along with the latest version of d3:
```
<script type="text/javascript" src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script type="text/javascript" src="d3gauge.js" charset="utf-8"></script>
```
{'fraction_non_alphanumeric': 0.1099429258035446, 'fraction_numerical': 0.02313006908981676, 'mean_word_length': 4.842105263157895, 'pattern_counts': {'":': 0, '<': 11, '<?xml version=': 0, '>': 11, 'https://': 6, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3240050', 'n_tokens_mistral': 1092, 'n_tokens_neox': 1007, 'n_words': 382}