# Adding axis labels to dashboard line chart

**URL:** https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403
**Category:** Dashboard
**Tags:** node-red-dashboard, chart
**Created:** [25 June 2023 14:29 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403 "2023-06-25T14:29:36Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![ruk-shan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ruk-shan/32/46377_2.png) [@ruk-shan](https://discourse.nodered.org/u/ruk-shan)
#### Post date: [25 June 2023 14:29 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403/1 "2023-06-25T14:29:36Z")

</div>

I have created a chart to display network ping time. But I can’t add labels to x and y axises. How can I do it, ? Can I add labels with CSS? If yes pls point me to a good example.  
Thank u so much. I love node-red and awesome developers/ community.

---

<div class="post-metadata">

### Author: ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [25 June 2023 14:57 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403/2 "2023-06-25T14:57:18Z")

</div>

You can add axis labels by sending this to chart

```auto
msg.ui_control = {
    options: {
        scales: {
            yAxes: [{
                scaleLabel:{
                    display:true,
                    labelString:'y-axis title'
                }
            }],
            xAxes: [{
                scaleLabel: {
                    display: true,
                    labelString: 'x-axis title'
                }
            }]
        }
    }
}
delete msg.payload;
return msg;

```

---

<div class="post-metadata">

### Author: ![ruk-shan](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/ruk-shan/32/46377_2.png) [@ruk-shan](https://discourse.nodered.org/u/ruk-shan)
#### Post date: [26 June 2023 10:07 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403/3 "2023-06-26T10:07:15Z")

</div>

Hi, hotNipi,  
Thank u so much, I have tested. This my code. I have tried the code, but when I inject the data goes missing. Pls help.

 ![after_inject](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/5/c/5ccc54e5d8baf2fad71817dd8f84296ecb571d22.png)  
 ![before_inject](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/8/88978c8eaf212d562d3e1892773ac18c14578a89.png)

[flows.json](https://discourse.nodered.org/uploads/short-url/lNLv0GR5aZS8A6tM5KRtTyxyoHO.json) (3.4 KB)  
Pls

---

<div class="post-metadata">

### Author: ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)
#### Post date: [26 June 2023 13:44 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403/4 "2023-06-26T13:44:19Z")

</div>

Oh yes, my bad. If to change scales and axes, it takes to have at least axis scale type for time series

```auto
msg.ui_control = {
    options: {
        scales: {
            yAxes: [{
                scaleLabel: {
                    display: true,
                    labelString: 'y-axis title'
                }
            }],
            xAxes: [{
                type: 'time',
                scaleLabel: {
                    display: true,
                    labelString: 'x-axis title'
                }
            }]
        }
    }
}
delete msg.payload;
return msg;

```

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)
#### Post date: [26 July 2023 13:45 UTC](https://discourse.nodered.org/t/adding-axis-labels-to-dashboard-line-chart/79403/5 "2023-07-26T13:45:11Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.