Reading data from CSV into separate traces

plotly.js
1

I am attempting to utilize Plotly (based on D3) to read through a CSV and return data into three separate traces - one for each year, in this case.

My hope is to create a chart such as depicted in this Codepen, but without the hard-coded data of sales data, by dealer and year.

I have researched a few examples of D3 reading CSV data but am unclear how to read my data into the separate traces by year.

Please note I also attempted to post at Stackoverflow as well.

I apologize that I am new to JavaScript in general. Please point me in the correct direction. Thank you!

2

Can you share a snippet of your CSV file to help us help you?

3

A sample of the CSV can be found @ https://github.com/apodagrosi/datasets/blob/master/PlotlyTest_Summary_SalesByDealerByYear.csv

Below are two of the examples I have been attempting to build upon:
Plotly example – reading CSV (https://codepen.io/plotly/pen/eNaErL)
Plotly example – basic time series (https://codepen.io/plotly/pen/NvazKR)

Thank you for any assistance or direction!

4

Here’s one way to do it:

5

This is exactly what I am looking for!

I then utilized ‘category order’ to order the x-axis values even with years that had no data.

Thank you for your help!

6

Hi there,

I think I have a similar problem, and I am also relatively new to Javascript.
I am also trying to create a graph with multiple traces. However, this is a scatterplot, and the traces are in different frames, so as to facilitate a button interaction.

The current code is in the link below. However, as with the initial query it is hard coded in. Ideally, I would like to be able to take the x and y values of each trace from a single CSV. Would this be possible to do?

Link here: https://codepen.io/NLCW88/pen/LdPMRP

Thanks and best regards!