Data points invisible? Very confused

1

I’m using Quickcharts to make a line chart. Somehow, none of my data points appear on the chart. The axes are reformatted correctly, but no data points or lines show up.

This is my chart link (apologies for the format, forum’s fault not mine): https://quickchart.io/chart?c={%22type%22:%22line%22,%22data%22:{%22datasets%22:[{%22label%22:%22Growth%22,%22backgroundColor%22:%22rgba(255,%2099,%20132,%200.5)%22,%22borderColor%22:%22rgb(255,%2099,%20132)%22,%22fill%22:false,%22data%22:[[{%22x%22:%222022-03-04T17:16:57.138Z%22,%22y%22:1},{%22x%22:%222022-03-07T19:03:04.976Z%22,%22y%22:0}]]},{%22label%22:%22Productivity%22,%22backgroundColor%22:%22rgba(54,%20162,%20235,%200.5)%22,%22borderColor%22:%22rgb(54,%20162,%20235)%22,%22fill%22:false,%22data%22:[[{%22x%22:%222022-03-04T17:16:57.138Z%22,%22y%22:1},{%22x%22:%222022-03-07T19:03:04.976Z%22,%22y%22:1}]]},{%22label%22:%22Accuracy%22,%22backgroundColor%22:%22rgba(54,%20162,%20235,%200.5)%22,%22borderColor%22:%22rgb(54,%20162,%20235)%22,%22fill%22:false,%22data%22:[[{%22x%22:%222022-03-04T17:16:57.138Z%22,%22y%22:0},{%22x%22:%222022-03-07T19:03:04.976Z%22,%22y%22:2}]]},{%22label%22:%22Effectiveness%22,%22backgroundColor%22:%22rgba(54,%20162,%20235,%200.5)%22,%22borderColor%22:%22rgb(54,%20162,%20235)%22,%22fill%22:false,%22data%22:[[{%22x%22:%222022-03-04T17:16:57.138Z%22,%22y%22:1},{%22x%22:%222022-03-07T19:03:04.976Z%22,%22y%22:3}]]},{%22label%22:%22Satisfaction%22,%22backgroundColor%22:%22rgba(54,%20162,%20235,%200.5)%22,%22borderColor%22:%22rgb(54,%20162,%20235)%22,%22fill%22:false,%22data%22:[[{%22x%22:%222022-03-04T17:16:57.138Z%22,%22y%22:1},{%22x%22:%222022-03-07T19:03:04.976Z%22,%22y%22:2}]]}]},%22options%22:{%22responsive%22:true,%22title%22:{%22display%22:true,%22text%22:%22Chart.js%20Time%20Point%20Data%22},%22scales%22:{%22xAxes%22:[{%22type%22:%22time%22,%22display%22:true,%22scaleLabel%22:{%22display%22:true,%22labelString%22:%22Date%22},%22ticks%22:{%22major%22:{%22enabled%22:true}}}],%22yAxes%22:[{%22display%22:true,%22scaleLabel%22:{%22display%22:true,%22labelString%22:%22value%22}}]}}}

Could someone tell me what’s going wrong with it? Why isn’t it making a line chart?

2

Hello,

You’ve made your datasets’ data into arrays of arrays. data should just be an array. Like this:

{
  "type": "line",
  "data": {
    "datasets": [
      {
        "label": "Dataset with string point data",
        "backgroundColor": "rgba(255, 99, 132, 0.5)",
        "borderColor": "rgb(255, 99, 132)",
        "fill": false,
        "data": [
          {
            "x": "2020-06-14T09:15:34-07:00",
            "y": 75
          },
          {
            "x": "2020-06-16T09:15:34-07:00",
            "y": -53
          },
          {
            "x": "2020-06-18T09:15:34-07:00",
            "y": 31
          },
          // ...

Here’s your fixed example

image
image1000×600 57.2 KB

2 Likes
3

ahhh I see. Thanks for the help!