Chartkick displaying numbers instead of dates

Question

I'm trying to display a line chart from a JSON data source, the problem is that my dates are being displayed like small numbers, I don't know why.

This is the JSON:

[[1341,"2018-01-22 18:00:00"],[1343,"2018-01-22 18:30:00"],[1319,"2018-01-22 19:00:00"],[1338,"2018-01-22 19:30:00"],[1340,"2018-01-22 20:00:00"],[1350,"2018-01-22 20:30:00"],[1327,"2018-01-22 21:00:00"],[1399,"2018-01-22 21:30:00"],[1385,"2018-01-22 22:00:00"],[1380,"2018-01-22 22:30:00"],[1340,"2018-01-22 23:00:00"],[1349,"2018-01-22 23:30:00"],[1343,"2018-01-23 00:00:00"],[1341,"2018-01-23 00:30:00"],[1324,"2018-01-23 01:00:00"],[1340,"2018-01-23 01:30:00"],[1350,"2018-01-23 02:00:00"],[1350,"2018-01-23 02:30:00"],[1325,"2018-01-23 03:00:00"],[1325,"2018-01-23 03:30:00"],[1325,"2018-01-23 04:00:00"],[null,"2018-01-23 04:30:00"],[1325,"2018-01-23 05:00:00"],[1349,"2018-01-23 05:30:00"],[1320,"2018-01-23 06:00:00"],[null,"2018-01-23 06:30:00"],[1348,"2018-01-23 07:00:00"],[null,"2018-01-23 07:30:00"],[1315,"2018-01-23 08:00:00"],[1316,"2018-01-23 08:30:00"],[1260,"2018-01-23 09:00:00"],[1261,"2018-01-23 09:30:00"],[1265,"2018-01-23 10:00:00"],[1271,"2018-01-23 10:30:00"],[1265,"2018-01-23 11:00:00"],[1250,"2018-01-23 11:30:00"],[1140,"2018-01-23 12:00:00"],[1066,"2018-01-23 12:30:00"],[1052,"2018-01-23 13:00:00"],[1190,"2018-01-23 13:30:00"],[1195,"2018-01-23 14:00:00"],[1245,"2018-01-23 14:30:00"],[1190,"2018-01-23 15:00:00"],[1155,"2018-01-23 15:30:00"],[1156,"2018-01-23 16:00:00"],[1138,"2018-01-23 16:30:00"],[1136,"2018-01-23 17:00:00"],[1135,"2018-01-23 17:30:00"],[1151,"2018-01-23 18:00:00"],[1135,"2018-01-23 18:30:00"],[1119,"2018-01-23 19:00:00"],[1149,"2018-01-23 19:30:00"],[1120,"2018-01-23 20:00:00"],[1120,"2018-01-23 20:30:00"],[1145,"2018-01-23 21:00:00"],[1150,"2018-01-23 21:30:00"],[1143,"2018-01-23 22:00:00"],[1126,"2018-01-23 22:30:00"],[1140,"2018-01-23 23:00:00"],[1142,"2018-01-23 23:30:00"]]

Which is rendered like this: render json: @chart

This is the resulting chart:

And the code to show the chart is:

<h1>Home#index</h1>
<p>Find me in app/views/home/index.html.erb</p>

 <%= line_chart path_for_the_data_in_json %>

Help please!

EDIT: And by the way how can I put the dates in the x-axis and values in the y-axis?

score -1 · Answer 1 · answered Jan 25 '18 at 02:17

I just had to put the date in ISO 8601 format and as the first element of each array in the array like this.

        data.each { |record|
            date = Time.at(record['fromDate'] * 0.001).strftime('%FT%T')

            @chart.push([date, record['close']])
        }

Chartkick displaying numbers instead of dates

1 Answers1