# Globadge

Do you like badges as much as I ([@serkan\_ozal](https://twitter.com/serkan_ozal)) do? Then **Globadge** is for you.

**Globadge** is free and fast badge generation service aiming to present everything (only limited by our dreams) as badges.

{% hint style="info" %}
Have a request for a new badge? Let me know it (email [me](mailto:serkanozal@gmail.com)) to bring it to you.
{% endhint %}


# Serverless

## AWS-Lambda

### AWS-Lambda Latest Layer Version

Shows the latest version of the specified AWS-Lambda layer.

#### URL 

`https://api.globadge.com/v1/badgen/aws/lambda/layer/latest-version/`***`{region}`***`/`***`{accountNo}`***`/`***`{layerName}`***

* **`region`:** The region where the layer is published 
* **`accountNo`:** The AWS account which owns the layer
* **`layerName`**: Name of the ayer

#### Example

The following example shows the URL for the latest version badge of the [Thundra](https://thundra.io) Node.js layer. 

* **`region`:** `us-east-1`
* **`accountNo`:** `269863060030`
* **`layerName`:** `thundra-lambda-node-layer`

[`https://api.globadge.com/v1/badgen/aws/lambda/layer/latest-version/`***`us-east-1`***`/`***`269863060030`***`/`***`thundra-lambda-node-layer`***](https://api.globadge.com/v1/badgen/aws/lambda/layer/latest-version/us-east-1/269863060030/thundra-lambda-node-layer)

[![Thundra Lambda Node.js Layer](https://api.globadge.com/v1/badgen/aws/lambda/layer/latest-version/us-east-1/269863060030/thundra-lambda-node-layer)](https://apm.docs.thundra.io/node.js/nodejs-integration-options)


# HTTP

## Generate Badge From HTTP Response

Generates the badge in SVG format from response of the given HTTP URL by processing the response with the given expression to resolve badge message. In the Globadge side, the execution steps are;

* Takes HTTP URL and expression as input
* Calls the given HTTP URL and gets the response
* Processes the returned result with the given expression to resolve the badge message
* Builds the badge from given label and resolve message to return to the client in SVG format

### URL 

`https://api.globadge.com/v1/badgen/http/{expressionType}?httpURL=<httpURL>&label=<label>&labelColor=<labelColor>&messageExpression=<messageExpression>&messageColor=<messageColor>`

* **`expressionType (*)`:** The type of the expression to be used while resolving badge message from HTTP URL response by message expression. Currently, only `jq` expressions are supported. This parameter is passed as **path** **parameter** and it is **mandatory.**
* **`httpURL (*)`:** The HTTP URL to be called with GET method for getting the response which will be used to resolve badge message by message expression. This parameter is passed as **query parameter** and it is **mandatory**.
* **`label (*)`**: The text of the badge label. This parameter is passed as **query parameter** and it is **mandatory**.
* **`messageExpression (*)`**: The expression to be used for resolving badge message from the response of the HTTP URL. The expression must be valid in the context of the expression type passed as path parameter as mentioned above. Currently, only `jq` expressions are supported. This parameter is passed as **query parameter** and it is **mandatory**.
* **`labelColor`**: The color of the badge label. The supported colors are listed [here](https://github.com/badges/shields/tree/master/badge-maker#colors). This parameter is passed as **query parameter** and it is **optional**.
* **`messageColor`**: The color of the badge message. The supported colors are listed [here](https://github.com/badges/shields/tree/master/badge-maker#colors).  This parameter is passed as **query parameter** and it is **optional**.

### Method

`GET`

### Notes

* Given HTTP URL is called only by `GET` method and it is not configurable by parameters.
* Badge responses are cached during **5 minutes**. So, even if the given HTTP URL returns different result, you will get the same badge response during 5 minutes (if the link has the same message expression and label parameters)&#x20;

### Example

The following example gets the latest version of the OpenTelemetry AWS Lambda Collector layer from Github releases:&#x20;

* **`expressionType`:** `jq`&#x20;
* **`httpURL`:** `https://api.github.com/repos/open-telemetry/opentelemetry-lambda/releases`
* **`label`:** `Collector` &#x20;
* **`messageExpression`:**&#x20;

  ```jq
  first(.[].tag_name | select(. | startswith(\"layer-collector\"))) | split(\"/\") | .[1] | sub(\"\\\\.\"; \"_\"; \"g\")
  ```

**Note:** Given parameters as part of the whole URL needs to be encoded as shown below.

{% embed url="<https://api.globadge.com/v1/badgen/http/jq?httpURL=https%3A%2F%2Fapi.github.com%2Frepos%2Fopen-telemetry%2Fopentelemetry-lambda%2Freleases&messageExpression=first%28.%5B%5D.tag_name%20%7C%20select%28.%20%7C%20startswith%28%22layer-collector%22%29%29%29%20%7C%20split%28%22%2F%22%29%20%7C%20.%5B1%5D%20%7C%20sub%28%22%5C%5C%5C%5C.%22%3B%20%22_%22%3B%20%22g%22%29&label=Collector>" %}

## Create Badge HTTP Config

Creates badge HTTP config from given options in the path parameter and request body. Then returns created config id and Globadge API URL to be invoked with GET request to generate the badge from saved config.

### URL&#x20;

`https://api.globadge.com/v1/badgen/http/{expressionType}`

### Method

`PUT`&#x20;

### Request

```json
{
    // [Mandatory] HTTP URL to be invoked with GET request to get response 
    "httpURL": "<HTTP-URL>",
    // [Optional] HTTP headers in string typed key/value format 
    "httpHeaders": {
        "<HEADER-1>": "<HEADER-1-VALUE>",
        ...
        "<HEADER-N>": "<HEADER-N-VALUE>",
    },
    // [Mandatory] Label of the badge
    "label": "<LABEL>",
    // [Mandatory] The expression to be used for resolving badge message from the response of the HTTP URL
    "messageExpression": "<MESSAGE-EXPRESSION>"
}
```

#### Example Request

```json
{
    "httpURL": "https://api.github.com/repos/open-telemetry/opentelemetry-lambda/releases",
    "httpHeaders": {
        "Authorization": "Bearer ...",
        ...
    },
    "label": "Collector",
    "messageExpression": "first(.[].tag_name | select(. | startswith(\"layer-collector\"))) | split(\"/\") | .[1] | sub(\"\\\\.\"; \"_\"; \"g\")"
}
```

### Response

Returns created config id and Globadge API URL to generate badge from saved configs:

```json
{
    // Id (in UUID v4 format) of the created badge HTTP config
    "id": "<HTTP-CONFIG-ID>",
    // Globadge API URL to be invoked with GET request to generate badge from saved config
    // "<EXPRESSION-TYPE>" represent the value passed in the request path parameters for the expression type
    // "<HTTP-CONFIG-ID>" represents the created config id which is returned in the "id" field in this response (above). 
    "url": "https://api.globadge.com/v1/badge/http/<EXPRESSION-TYPE>/<HTTP-CONFIG-ID>"
}
```

## Generate Badge From HTTP Response (By Created Config)

Generates the badge in SVG format from the given created badge HTTP config [here](#create-badge-http-config).&#x20;

In the Globadge side, the execution steps are;

* Gets the badge config (HTTP URL, HTTP headers, expression, label, etc ...) from the given config id
* Takes HTTP URL and expression as input
* Calls the given HTTP URL with the configured HTTP headers (if there is) and gets the response
* Processes the returned result with the given expression to resolve the badge message
* Builds the badge from given label and resolve message to return to the client in SVG format

### URL&#x20;

`https://api.globadge.com/v1/badgen/http/{expressionType}/{httpConfigId}`&#x20;

**`expressionType (*)`:** The type of the expression to be used while resolving badge message from HTTP URL response by message expression. Currently, only `jq` expressions are supported. This parameter is passed as **path** **parameter** and it is **mandatory.**

**`httpConfigId (*)`:** Id (in UUID v4 format) of the created badge HTTP config [here](#create-badge-http-config). This parameter is passed as **path** **parameter** and it is **mandatory.**

### Method

`GET`

### Notes

* Given HTTP URL is called only by `GET` method and it is not configurable by parameters.
* Badge responses are cached during **5 minutes**. So, even if the given HTTP URL returns different result, you will get the same badge response during 5 minutes.

### Example

The following example shows the latest version of the OpenTelemetry AWS Lambda Collector layer from Github releases:&#x20;

* **`expressionType`:** `jq`&#x20;
* **`httpConfigId`:** `e3309d56-dfd6-4dae-ac00-4498070d84f0`&#x20;

{% embed url="<https://api.globadge.com/v1/badgen/http/jq/e3309d56-dfd6-4dae-ac00-4498070d84f0>" %}


# Line Chart

## Time Series Line Chart

### Generate Chart

Generates time series line chart from given time series points.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/line/time`

#### Method

`POST`

#### Request

```json
{
    "options": {
        // [Optional] Width of the chart. 
        // Min value is "200" and default value is "650"
    	"width": 1000, .
        // [Optional] Heigth of the chart. 
        // Min value is "150" and default value is "400".
        "height": 500, 
        // [Optional] X axis configs.
        "xAxis": {
            // [Optional] X axis label
            "label": "Time",
            // [Optional] X axis (axis line, ticks, label) color
            "color": "#4daf4a"
        },
        // [Optional] Y axis configs.
        "yAxis": {
            // [Optional] Y axis label
            "label": "Network I/O (KB)",
            // [Optional] Y axis (axis line, ticks, label) color
            "color": "#ff7f00"
        },
        // [Mandatory] Time ticks.
        "timeTicks": {
                // [Mandatory] Time tick unit. 
                // Valid values are: 
                //     - "auto" (sets "interval" and "format" adaptively according to data points and chart width)
                //     - "year"
                //     - "month"
                //     - "week"
                //     - "day"
                //     - "hour"
                //     - "minute"
                //     - "second"
                //     - "millisecond" 
        	"unit": "day",
                // [Optional] Time tick interval. 
                // Min value is "1" and default value is "1".
                // When "unit" property is specified as "auto", 
                // this configuration is ignored even though it is specified. 
                "interval": 7,
                // [Optional] Time tick format. 
                // Some example supported specifiers are:
                //     - %Y: Year
                //     - %m: Month
                //     - %d: Day
                //     - %H: Hour
                //     - %S: Second
                // See "https://github.com/d3/d3-time-format" for more details. 
                // When "unit" property is specified as "auto", 
                // this configuration is ignored even though it is specified. 
        	"format": "%d/%m"
        }	
    },
    // [Mandatory] Lines. 
    // There can be 9 lines at most.
    "lines": [
        {
            // [Optional] Line label
            "label": "Read",
            // [Optional] Line color
            "color": "#be4d25",
            // [Mandatory] Points
            "points": [
                {
                    // [Mandatory] Time of the point as UNIX epoch timestamp. 
                    "x": 788911200000,
                    // [Mandatory] Value of the point.
                    // Min value is "0". Negative values are not supported.
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "Write",
            "color": "#6c25be",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

#### Response

Returns generated chart SVG content in the response body:

```xml
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1000" height="500">
    ...
</svg>
```

![Sample Line chart SVG](/files/pJVz2iu9QcjojMjEBStJ)

The following example shows body of an example request to generate time series line chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/line/time`

#### Method

`POST`

```json
{
    "options": {
    	"width": 1000,
    	"height": 500,
        "xAxis": {
            "label": "Time",
            "color": "#4daf4a"
        },
        "yAxis": {
            "label": "Network I/O (KB)",
            "color": "#ff7f00"
        },
        "timeTicks": {
        	"unit": "day",
        	"interval": 7,
        	"format": "%d/%m"
        }	
    },
    "lines": [
        {
            "label": "Read",
            "color": "#be4d25",
            "points": [
                {
                    "x": 788911200000,
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "Write",
            "color": "#6c25be",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

### Generate and Host Chart

Generates time series line chart from given time series points and returns a link to access hosted chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/line/time`

#### Method

`PUT`

#### Request

```json
{
    "options": {
        // [Optional] Width of the chart. 
        // Min value is "200" and default value is "650"
    	"width": 1000, .
        // [Optional] Heigth of the chart. 
        // Min value is "150" and default value is "400".
        "height": 500, 
        // [Optional] X axis configs.
        "xAxis": {
            // [Optional] X axis label
            "label": "Time",
            // [Optional] X axis (axis line, ticks, label) color
            "color": "#4daf4a"
        },
        // [Optional] Y axis configs.
        "yAxis": {
            // [Optional] Y axis label
            "label": "Network I/O (KB)",
            // [Optional] Y axis (axis line, ticks, label) color
            "color": "#ff7f00"
        },
        // [Mandatory] Time ticks.
        "timeTicks": {
                // [Mandatory] Time tick unit. 
                // Valid values are: 
                //     - "year",
                //     - "month"
                //     - "week"
                //     - "day"
                //     - "hour"
                //     - "minute"
                //     - "second"
                //     - "millisecond" 
        	"unit": "day",
                // [Optional] Time tick interval. 
                // Min value is "1" and default value is "1" 
                "interval": 7,
                // [Optional] Time tick format. 
                // Some example supported specifiers are:
                //     - %Y: Year
                //     - %m: Month
                //     - %d: Day
                //     - %H: Hour
                //     - %S: Second
                // See "https://github.com/d3/d3-time-format" for more details. 
        	"format": "%d/%m"
        }	
    },
    // [Mandatory] Lines. 
    // There can be 9 lines at most.
    "lines": [
        {
            // [Optional] Line label
            "label": "Read",
            // [Optional] Line color
            "color": "#be4d25",
            // [Mandatory] Points
            "points": [
                {
                    // [Mandatory] Time of the point as UNIX epoch timestamp. 
                    "x": 788911200000,
                    // [Mandatory] Value of the point.
                    // Min value is "0". Negative values are not supported.
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "Write",
            "color": "#6c25be",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

#### Response

Returns id and the link for the hosted chart SVG content in the response body:

```json
{
    "id": "chart_line_time_efdeb1be-e7d2-40bf-90fc-6ab00482f04a",
    "url": "https://api.globadge.com/v1/chartgen/line/time/chart_line_time_efdeb1be-e7d2-40bf-90fc-6ab00482f04a"
}
```

Then you can use the provided `url` in the response body to access or embed hosted chart SVG content.

The following example shows body of an example request to generate hosted time series line chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/line/time`

#### Method

`PUT`

```json
{
    "options": {
    	"width": 1000,
    	"height": 500,
        "xAxis": {
            "label": "Time",
            "color": "#4daf4a"
        },
        "yAxis": {
            "label": "Network I/O (KB)",
            "color": "#ff7f00"
        },
        "timeTicks": {
        	"unit": "day",
        	"interval": 7,
        	"format": "%d/%m"
        }	
    },
    "lines": [
        {
            "label": "Read",
            "color": "#be4d25",
            "points": [
                {
                    "x": 788911200000,
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "Write",
            "color": "#6c25be",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```


# Stacked Area

## Time Series Stacked Area Chart

### Generate Chart

Generates time series stacked area chart from given time series points.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/stacked-area/time`

#### Method

`POST`

#### Request

```json
{
    "options": {
        // [Optional] Width of the chart. 
        // Min value is "200" and default value is "650"
    	"width": 1000, .
        // [Optional] Heigth of the chart. 
        // Min value is "150" and default value is "400".
        "height": 500, 
        // [Optional] X axis configs.
        "xAxis": {
            // [Optional] X axis label
            "label": "Time",
            // [Optional] X axis (axis line, ticks, label) color
            "color": "#984ea3"
        },
        // [Optional] Y axis configs.
        "yAxis": {
            // [Optional] Y axis label
            "label": "Memory Usage (%)",
            // [Optional] Y axis (axis line, ticks, label) color
            "color": "#377eb8"
        },
        // [Mandatory] Time ticks.
        "timeTicks": {
                // [Mandatory] Time tick unit. 
                // Valid values are: 
                //     - "auto" (sets "interval" and "format" adaptively according to data points and chart width)
                //     - "year"
                //     - "month"
                //     - "week"
                //     - "day"
                //     - "hour"
                //     - "minute"
                //     - "second"
                //     - "millisecond" 
        	"unit": "day",
                // [Optional] Time tick interval. 
                // Min value is "1" and default value is "1".
                // When "unit" property is specified as "auto", 
                // this configuration is ignored even though it is specified. 
                "interval": 7,
                // [Optional] Time tick format. 
                // Some example supported specifiers are:
                //    - %Y: Year
                //    - %m: Month
                //    - %d: Day
                //    - %H: Hour
                //    - %S: Second
                // See "https://github.com/d3/d3-time-format" for more details. 
                // When "unit" property is specified as "auto", 
                // this configuration is ignored even though it is specified. 
        	"format": "%d/%m"
        }	
    },
    // [Mandatory] Areas. 
    // There can be 9 areas at most.
    "areas": [
        {
            // [Optional] Area label
            "label": "User",
            // [Optional] Area color
            "color": "#e41a1c99",
            // [Mandatory] Points
            "points": [
                {
                    // [Mandatory] Time of the point as UNIX epoch timestamp. 
                    "x": 788911200000,
                    // [Mandatory] Value of the point.
                    // Min value is "0". Negative values are not supported.
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "System",
            "color": "#ff7f0099",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

#### Response

Returns generated chart SVG content in the response body:

```xml
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1000" height="500">
    ...
</svg>
```

![Sample Stacked Area chart SVG](/files/0GIjJKeFUE0ASMjl71GF)

The following example shows body of an example request to generate time series stacked area chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/stacked-area/time`

#### Method

`POST`

```json
{
    "options": {
    	"width": 1000,
    	"height": 500,
        "xAxis": {
            "label": "Time",
            "color": "#984ea3"
        },
        "yAxis": {
            "label": "Memory Usage (%)",
            "color": "#377eb8"
        },
        "timeTicks": {
            "unit": "day",
            "interval": 7,
            "format": "%d/%m"
        }	
    },
    "areas": [
        {
            "label": "User",
            "color": "#e41a1c99",
            "points": [
                {
                    "x": 788911200000,
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "System",
            "color": "#ff7f0099",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

### Generate and Host Chart

Generates time series stacked area chart from given time series points and returns a link to access hosted chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/stacked-area/time`

#### Method

`PUT`

#### Request

```json
{
    "options": {
        // [Optional] Width of the chart. 
        // Min value is "200" and default value is "650"
    	"width": 1000, .
        // [Optional] Heigth of the chart. 
        // Min value is "150" and default value is "400".
        "height": 500, 
        // [Optional] X axis configs.
        "xAxis": {
            // [Optional] X axis label
            "label": "Time",
            // [Optional] X axis (axis line, ticks, label) color
            "color": "#984ea3"
        },
        // [Optional] Y axis configs.
        "yAxis": {
            // [Optional] Y axis label
            "label": "Memory Usage (%)",
            // [Optional] Y axis (axis line, ticks, label) color
            "color": "#377eb8"
        },
        // [Mandatory] Time ticks.
        "timeTicks": {
                // [Mandatory] Time tick unit. 
                // Valid values are: 
                //     - "year",
                //     - "month"
                //     - "week"
                //     - "day"
                //     - "hour"
                //     - "minute"
                //     - "second"
                // .   - "millisecond" 
        	"unit": "day",
                // [Optional] Time tick interval. 
                // Min value is "1" and default value is "1" 
                "interval": 7,
                // [Optional] Time tick format. 
                // Some example supported specifiers are:
                // .   - %Y: Year
                // .   - %m: Month
                //     - %d: Day
                // .   - %H: Hour
                // .   - %S: Second
                // See "https://github.com/d3/d3-time-format" for more details. 
        	"format": "%d/%m"
        }	
    },
    // [Mandatory] Areas. 
    // There can be 9 areas at most.
    "areas": [
        {
            // [Optional] Area label
            "label": "User",
            // [Optional] Area color
            "color": "#e41a1c99",
            // [Mandatory] Points
            "points": [
                {
                    // [Mandatory] Time of the point as UNIX epoch timestamp. 
                    "x": 788911200000,
                    // [Mandatory] Value of the point.
                    // Min value is "0". Negative values are not supported.
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "System",
            "color": "#ff7f0099",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```

#### Response

Returns id and the link for the hosted chart SVG content in the response body:

```json
{
    "id": "chart_stacked_area_time_efdeb1be-e7d2-40bf-90fc-6ab00482f04a",
    "url": "https://api.globadge.com/v1/chartgen/stacked-area/time/chart_stacked_areas_time_efdeb1be-e7d2-40bf-90fc-6ab00482f04a"
}
```

Then you can use the provided `url` in the response body to access or embed hosted chart SVG content.

The following example shows body of an example request to generate hosted time series stacked area chart.

#### URL&#x20;

`https://api.globadge.com/v1/chartgen/stacked-area/time`

#### Method

`PUT`

```json
{
    "options": {
    	"width": 1000,
    	"height": 500,
        "xAxis": {
            "label": "Time",
            "color": "#984ea3"
        },
        "yAxis": {
            "label": "Memory Usage (%)",
            "color": "#377eb8"
        },
        "timeTicks": {
        	"unit": "day",
        	"interval": 7,
        	"format": "%d/%m"
        }	
    },
    "areas": [
        {
            "label": "User",
            "color": "#e41a1c99",
            "points": [
                {
                    "x": 788911200000,
                    "y": 1
                },
                {
                    "x": 791503200000,
                    "y": 2
                },
                {
                    "x": 794095200000,
                    "y": 3
                }
            ]
        },
        {
            "label": "System",
            "color": "#ff7f0099",
            "points": [
                {
                    "x": 788911200000,
                    "y": 10
                },
                {
                    "x": 791503200000,
                    "y": 20
                },
                {
                    "x": 794095200000,
                    "y": 30
                }
            ]
        }
    ] 
}
```