diff options
Diffstat (limited to 'web/api/badges/README.md')
| -rw-r--r-- | web/api/badges/README.md | 66 |
1 files changed, 57 insertions, 9 deletions
diff --git a/web/api/badges/README.md b/web/api/badges/README.md index f199c5802..b5fc53468 100644 --- a/web/api/badges/README.md +++ b/web/api/badges/README.md @@ -1,3 +1,8 @@ +<!-- +title: "Netdata badges" +custom_edit_url: https://github.com/netdata/netdata/edit/master/web/api/badges/README.md +--> + # Netdata badges **Badges are cool!** @@ -20,7 +25,7 @@ Similarly, there is [a chart that shows outbound bandwidth per class](http://lon The right one is a **volume** calculation. Netdata calculated the total of the last 86.400 seconds (a day) which gives `kilobits`, then divided it by 8 to make it KB, then by 1024 to make it MB and then by 1024 to make it GB. Calculations like this are quite accurate, since for every value collected, every second, Netdata interpolates it to second boundary using microsecond calculations. -Let's see a few more badge examples (they come from the [Netdata registry](../../../registry/)): +Let's see a few more badge examples (they come from the [Netdata registry](/registry/README.md)): - **cpu usage of user `root`** (you can pick any user; 100% = 1 core). This will be `green <10%`, `yellow <20%`, `orange <50%`, `blue <100%` (1 core), `red` otherwise (you define thresholds and colors on the URL). @@ -178,19 +183,62 @@ These are options dedicated to badges: Divide the value with this number. The default is `1`. -- `label_color=COLOR` +- Color customization parameters + + The following parameters specify colors of each individual part of the badge. Each parameter is documented in detail + below. + + | Area of badge | Background color parameter | Text color parameter | + | ---: | :------------------------: | :------------------: | + | Label (left) part | `label_color` | `text_color_lbl` | + | Value (right) part | `value_color` | `text_color_val` | + + - `label_color=COLOR` + + The color of the label (the left part). You can use any HTML color in `RGB` or `RRGGBB` hex notation (without + the `#` character at the beginning). Additionally, you can use one of the following predefined colors (and you + can use them by their name): + + - `green` + - `brightgreen` + - `yellow` + - `yellowgreen` + - `orange` + - `red` + - `blue` + - `grey` + - `gray` + - `lightgrey` + - `lightgray` + + These colors are taken from <https://github.com/badges/shields>, which makes them compatible with standard + badges. + + - `value_color=COLOR:null|COLOR<VALUE|COLOR>VALUE|COLOR>=VALUE|COLOR<=VALUE|...` + + You can add a pipe delimited list of conditions to pick the value color. The first matching (left to right) will + be used. + + Example: `value_color=grey:null|green<10|yellow<100|orange<1000|blue<10000|red` + + The above will set `grey` if no value exists (not collected within the `gap when lost iterations above` in + `netdata.conf` for the chart), `green` if the value is less than 10, `yellow` if the value is less than 100, and + so on. Netdata will use `red` if no other conditions match. Only integers are supported as values. - The color of the label (the left part). You can use any HTML color, include `#NNN` and `#NNNNNN`. The following colors are defined in Netdata (and you can use them by name): `green`, `brightgreen`, `yellow`, `yellowgreen`, `orange`, `red`, `blue`, `grey`, `gray`, `lightgrey`, `lightgray`. These are taken from <https://github.com/badges/shields> so they are compatible with standard badges. + The supported operators are `<`, `>`, `<=`, `>=`, `=` (or `:`), and `!=` (or `<>`). -- `value_color=COLOR:null|COLOR<VALUE|COLOR>VALUE|COLOR>=VALUE|COLOR<=VALUE|...` + You can also use the same syntax as the `label_color` parameter to define each of these colors. You can + reference a predefined color by name or `RGB`/`RRGGBB` hex notation. - You can add a pipe delimited list of conditions to pick the color. The first matching (left to right) will be used. + - `text_color_lbl=RGB` or `text_color_lbl=RRGGBB` or `text_color_lbl=color_by_name` - Example: `value_color=grey:null|green<10|yellow<100|orange<1000|blue<10000|red` + This value specifies the font color for the font of left/label side of the badge. The syntax is the same as the + `label_color` parameter. If not given, or given with an empty value, Netdata will use the default color. - The above will set `grey` if no value exists (not collected within the `gap when lost iterations above` in `netdata.conf` for the chart), `green` if the value is less than 10, `yellow` if the value is less than 100, etc up to `red` which will be used if no other conditions match. + - `text_color_val=RGB` or `text_color_val=RRGGBB` or `text_color_lbl=color_by_name` - The supported operators are `<`, `>`, `<=`, `>=`, `=` (or `:`) and `!=` (or `<>`). + This value specifies the font color for the font of right/value side of the badge. The syntax is the same as the + `label_color` parameter. If not given, or given with an empty value, Netdata will use the default color. - `precision=NUMBER` @@ -250,7 +298,7 @@ These are options dedicated to badges: </script> ``` -A more advanced badges refresh method is to include `http://your.netdata.ip:19999/refresh-badges.js` in your page. For more information and use example, [check this](../../gui/refresh-badges.js). +A more advanced badges refresh method is to include `http://your.netdata.ip:19999/refresh-badges.js` in your page. --- |