# Quickchart.io Timing Integration Problem

**URL:** <https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225>\
**Category:** Ask for Help\
**Created:** [February 27, 2024, 9:11pm UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225 "2024-02-27T21:11:55Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![corbmore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/corbmore/32/69365_2.png) [@corbmore](https://community.glideapps.com/u/corbmore)\
**Post date:** [February 27, 2024, 9:11pm UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225/1 "2024-02-27T21:11:55Z")

</div>

In Glide I have 2 columns I want to graph (there will be more than that but I’ll start there) using [quickchart.io](http://quickchart.io).

Column 1  
Date (MM/DD/YYYY)

Column 2  
Sales

I’m trying to plot using [Quickchart.io](http://Quickchart.io) ‘Line’ and am having a lot of difficulty integrating Date/time (ie x-axis). I’ve played around a lot with their GPT builder and even tried using chat GPT, but I guess I’m not using the correct syntax. Below is the base example I’m using that is straight from one of QC’s example charts with the date format modification to the label. I’m then taking this and putting this into a glide template and subbing in my 2 columns in “labels” and “data”. Since these 2 columns are user inputs, they will dynamic.

```auto
{
  type: 'line',
  data: {
    labels: ['01/01/2024', '02/01/2024', '03/01/2024', '04/01/2024', '05/01/2024', '06/01/2024', '07/01/2024'],
    datasets: [
      {
        label: 'My First dataset',
        backgroundColor: 'rgb(255, 99, 132)',
        borderColor: 'rgb(255, 99, 132)',
        fill: false,
        data: [800000, 90, 800, 400000, 900000, 50000, 600],
      },
   
    ],
  },
  options: {
    responsive: true,
    title: {
      display: true,
      text: 'Chart.js Line Chart - Logarithmic',
    },
    scales: {
      xAxes: [
        {
          type: 'time',
          time: {
            unit: 'month',
            displayFormats: {
              month: 'MM/DD/YYYY'
            }
          }
        }
      ],
      yAxes: [
        {
          display: true,
          type: 'logarithmic',
        },
      ],
    },
  },
}

```

Any help is appreciated. Also, if you would be willing to coach me through some of this app, DM me your rates.

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [February 27, 2024, 11:46pm UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225/2 "2024-02-27T23:46:10Z")

</div>

Can you show us your columns configuration that are related to this through some screenshots?

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [February 28, 2024, 1:53am UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225/3 "2024-02-28T01:53:16Z")

</div>

> [@corbmore](#):
>
> I’m then taking this and putting this into a glide template and subbing in my 2 columns in “labels” and “data”. Since these 2 columns are user inputs, they will dynamic.

Click into this template column, and copy the output. Then paste that into the quickchart sandbox editor (or paste it here if you want). That should provide a clue.

---

<div class="post-metadata">

**Author:** ![corbmore](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/corbmore/32/69365_2.png) [@corbmore](https://community.glideapps.com/u/corbmore)\
**Post date:** [February 28, 2024, 4:05am UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225/4 "2024-02-28T04:05:48Z")

</div>

Sure thing. Here’s a more simplified version of a chart for ease of posting. This is one of the ‘line’ examples from the QC website with a few small changes. It’s still very primitive, but figured I’d start here and build it up from here. On the plot I’ve run into several different errors in my experimenting, but this is the “closest” to a solution Ive been.

I want the x axis to be the Production Month (ProdMon). The more I’ve examined this it appears QC is (literally) just dividing 7 by 1 by 2015 (ie. 7/1/2015) for the label.

 ![XY Plots](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/2/6/266c4346b0112c09aefd4b7ce758c070bf9b57da.png)  
 ![List XY.PNG](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/3/d/3dc1ace8b3762b74fdb386cb80e764a7a3d30519.jpeg)  
 ![Chart Template](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/8/6/86b3d814b288ad56b2a8e5eea9e7b438d39334a1.png)  
 ![Graph](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/7/b7db52e72dde2cad08a665de29ffe60d2a3be137.png)

[https://quickchart.io/chart?c=](https://quickchart.io/chart?c=) { type: ‘line’, data: { labels: [ProdMon], datasets: [{ label: ‘Production’, data: [ListProd], fill: false, borderColor: ‘red’, borderDash: [5, 5], } ], }, options: { scales: { yAxes: [{ type: ‘logarithmic’, }] } } }

---

<div class="post-metadata">

**Author:** ![Darren\_Murphy](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/darren_murphy/32/47326_2.png) [@Darren\_Murphy](https://community.glideapps.com/u/Darren_Murphy)\
**Post date:** [February 28, 2024, 4:15am UTC](https://community.glideapps.com/t/quickchart-io-timing-integration-problem/71225/5 "2024-02-28T04:15:03Z")

</div>

> [@corbmore](#):
>
> I want the x axis to be the Production Month (ProdMon). The more I’ve examined this it appears QC is (literally) just dividing 7 by 1 by 2015 (ie. 7/1/2015) for the label.

Yeah, that’s because you are passing the dates as bare strings, so they are being interpreted as formulas. What you need to do is enclose each date in single quotes, eg: `'7/1/2015', '8/2/2015', etc..`
