x-axis to support toISOString?

[Joel-Mckay]

Thanks for publishing a simple d3 example, as I have been doing a project that can benefit from server side chart rendering.

I was looking at the library source, and as I am new to d3 it seemed one had to setup the d3.timeParse to get proper date support on the x-axis.

While I can generate string labels instead, in seems to lib only accepts numeric key types.
I wanted to add labels with:
moment(myUTCTime).toISOString()

Would you recommend I use this method instead?
https://bl.ocks.org/d3noob/c506ac45617cf9ed39337f99f8511218

Cheers,
J

I saw your advice to others:
#4 (comment)

And was able to rotate the labels, but it is unclear how d3 needs to be setup to parse date+Times.

That patched area of index.js I made was in:

const lineChart = d3.line()
.x(d => xScale(d.key)) //I assumed your advice to patch is here, but it was unclear how it renders the labels
.y(d => yScale(d.value));

if (_isCurve) lineChart.curve(d3.curveBasis);

// g.append('g')
// .attr('transform', translate(0, ${height}))
// .call(xAxis);

//add the x Axis with a -65deg rotation to reduce marker label overlap
svg.append("g")
.attr("class", "x axis")
.attr('transform', translate(0,${height}))
.call(xAxis)
.selectAll("text")
.style("text-anchor", "end")
.attr("dx", "-.8em")
.attr("dy", ".15em")
.attr("transform", "rotate(-65)");

g.append('g').call(yAxis);

g.append('g')
.attr('fill', 'none')
.attr('stroke-width', _lineWidth)
.selectAll('path')
.data(allKeys ? data : [data])
.enter().append("path")
.attr('stroke', (d, i) => i < _lineColors.length ? _lineColors[i] : _lineColor)
.attr('d', lineChart);

[KD33]

Have you had any success with this?