# HubSpot UI Extensions | Issue with LineChart component: not rendering datetime correctly

**URL:** <https://community.hubspot.com/t/hubspot-ui-extensions-issue-with-linechart-component-not-rendering-datetime-correctly/118272>\
**Category:** APIs & Integrations\
**Tags:** crm\
**Created:** [October 13, 2024, 8:02pm UTC](https://community.hubspot.com/t/hubspot-ui-extensions-issue-with-linechart-component-not-rendering-datetime-correctly/118272 "2024-10-13T20:02:19Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![MAsghari](https://avatars.discourse-cdn.com/v4/letter/m/76d3ee/32.png) [@MAsghari](https://community.hubspot.com/u/MAsghari)\
**Post date:** [October 13, 2024, 8:02pm UTC](https://community.hubspot.com/t/hubspot-ui-extensions-issue-with-linechart-component-not-rendering-datetime-correctly/118272/1 "2024-10-13T20:02:19Z")

</div>

I’m using the `LineChart` component in a HubSpot UI extension. My data contains Unix timestamps, but when I set `fieldType: 'datetime'` for the x-axis, the chart doesn’t display the date properly. I converted the timestamps to ISO 8601 format using `new Date(item.Date).toISOString()`, but it still doesn’t work as expected. How should I format the date for proper rendering in the `LineChart`?

Here is my code snippet related to LineChart axises:

```lia-code-sample
 axes={{
 x: { field: 'Date', fieldType: 'datetime' },
 y: { field: 'Value', fieldType: 'category' },
 options: { groupFieldByColor: 'Breakdown' },
 }}

```

Here is my test data:

```lia-code-sample
 const myData = [
 { Date: 1728661545534, Breakdown: 'firstname', Value: 'value x' },
 { Date: 1727957473752, Breakdown: 'firstname', Value: 'value y' },
 { Date: 1727957473752, Breakdown: 'lastname', Value: 'value z' },
 ];

```

and here is the error I receive:

Highcharts error #14: [www.highcharts.com/errors/14/](http://www.highcharts.com/errors/14/)

So, is any has any clue? I want to show some string values on “Y” axis with their Date which I provided on timestamps!

Super curious to know the answer, thx!

---

<div class="post-metadata">

**Author:** ![DianaGomez](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/dianagomez/32/48035_2.png) [@DianaGomez](https://community.hubspot.com/u/DianaGomez)\
**Post date:** [October 14, 2024, 2:05pm UTC](https://community.hubspot.com/t/hubspot-ui-extensions-issue-with-linechart-component-not-rendering-datetime-correctly/118272/2 "2024-10-14T14:05:23Z")

</div>

Hi @MAsghari,

Happy Monday!

Thanks so much for providing all these details! Let’s check with some of our experts to see if they have experience with this topic or if they have attempted to format the date to show some string values.

Hi @Kevin-C @Teun @PatOfCle, do you have any experience here?

Thanks,  
Diana

---

<div class="post-metadata">

**Author:** ![aanchalshethHS](https://avatars.discourse-cdn.com/v4/letter/a/bbce88/32.png) [@aanchalshethHS](https://community.hubspot.com/u/aanchalshethHS)\
**Post date:** [October 22, 2024, 3:28pm UTC](https://community.hubspot.com/t/hubspot-ui-extensions-issue-with-linechart-component-not-rendering-datetime-correctly/118272/3 "2024-10-22T15:28:15Z")

</div>

Hello @MAsghari ,  
Thanks for your question. For charting data effectively, there has to be at least one linear axis. If you’re trying to graph which value happens when, the best thing to do is to reformat the data so that ‘value x’, ‘value y’ etc also have a ‘count’ value associated with them. You could also convert “value x, value y, value z” to numbers if they are actually numbers. We’ll take this note and find a way to be more clearer about these axes, so appreciate you bringing this up.  
Please feel free to follow up with any more questions.