问题
I am trying to learn some chart rendering techniques for front end web development. There is a d3 tutorial where the javascript function can be edited on the website (great for learning purposes) and I am attempting to use my own data instead. In the tutorial website I am attempting to modify the rawgit
//Read the data
d3.csv("https://raw.githubusercontent.com/holtzy/data_to_viz/master/Example_dataset/3_TwoNumOrdered_comma.csv",
with my own rawgit dataset:
//Read the data
d3.csv("https://raw.githubusercontent.com/bbartling/Data/master/City%20Rec%20Center%202%20kW%202019.csv",
One thing to note is my data is hourly and the tutorial data is daily.. So would I need to modify anything with the time parse function?
// When reading the csv, I must format variables:
function(d){
return { date : d3.timeParse("%Y-%m-%d")(d.date), value : d.value }
},
I am trying to follow this learn javascript site that talks about timeParse
but not having anyluck... Could anyone give me a tip?
Also to mention my dataset the timestamp/index column is Date
not date
and the data is kW
not value
... Do I need to modify the tutorial code to accommodate for this as well?
回答1:
I think I actually figured this out. At least I got the chart to render on the tutorial site... Changing the timeParse
function to this:
//Read the data
d3.csv("https://raw.githubusercontent.com/bbartling/Data/master/City%20Rec%20Center%202%20kW%202019.csv",
// When reading the csv, I must format variables:
function(d){
return { date : d3.timeParse("%m/%d/%Y %H:%M")(d.Date), value : d.kW }
},
来源:https://stackoverflow.com/questions/63016839/javascript-d3-render-chart