getGraphData() {
// data is of shape [{date, value}, ...] and is sorted by date (ASC)
let { data } = this.props;
this.initRanges(true);
// Convert dates into D3 dates
data = data.map(d => ({
date: parseDate(d.date),
value: d.value
}));
// determine date range
let firstDate = this.props.first ? parseDate(this.props.first) : data[0].date;
let lastDate = this.props.last ? parseDate(this.props.last) : data[data.length - 1].date;
// if last prop is after last value, we need to add that difference as
// padding before first value to right-align sparkline
const skip = lastDate - data[data.length - 1].date;
if (skip > 0) {
firstDate -= skip;
lastDate -= skip;
}
this.x.domain([firstDate, lastDate]);
// determine value range
const minValue = this.props.min !== undefined ? this.props.min : d3Min(data, d => d.value);
const maxValue = this.props.max !== undefined
? Math.max(this.props.max, d3Max(data, d => d.value)) : d3Max(data, d => d.value);
this.y.domain([minValue, maxValue]);
const lastValue = data[data.length - 1].value;
const lastX = this.x(lastDate);
const lastY = this.y(lastValue);
const min = formatMetricSvg(d3Min(data, d => d.value), this.props);
const max = formatMetricSvg(d3Max(data, d => d.value), this.props);
const mean = formatMetricSvg(d3Mean(data, d => d.value), this.props);
const title = `Last ${Math.round((lastDate - firstDate) / 1000)} seconds, ` +
`${data.length} samples, min: ${min}, max: ${max}, mean: ${mean}`;
return {
data, lastX, lastY, title
};
}
data = data.map(d => ({
date: parseDate(d.date),
value: d.value
}));