40332963ef
This updates to Ember 3.16 but leaves Ember Data at 3.12 so we don’t need to use the model fragments beta. It can be reviewed on a commit-by-commit basis: blueprint updates, fixes for test failures, and the removal of now-deprecated partials. It’s not a true update to Octane as that would involve turning on template-only components by default, which breaks various things. We can accomplish that separately and then add the edition setting to package.json.
78 lines
2.1 KiB
JavaScript
78 lines
2.1 KiB
JavaScript
import { computed } from '@ember/object';
|
|
import moment from 'moment';
|
|
import d3TimeFormat from 'd3-time-format';
|
|
import d3Format from 'd3-format';
|
|
import d3Scale from 'd3-scale';
|
|
import d3Array from 'd3-array';
|
|
import LineChart from 'nomad-ui/components/line-chart';
|
|
import layout from '../templates/components/line-chart';
|
|
import formatDuration from 'nomad-ui/utils/format-duration';
|
|
import classic from 'ember-classic-decorator';
|
|
|
|
@classic
|
|
export default class StatsTimeSeries extends LineChart {
|
|
layout = layout;
|
|
|
|
xProp = 'timestamp';
|
|
yProp = 'percent';
|
|
timeseries = true;
|
|
|
|
xFormat() {
|
|
return d3TimeFormat.timeFormat('%H:%M:%S');
|
|
}
|
|
|
|
yFormat() {
|
|
return d3Format.format('.1~%');
|
|
}
|
|
|
|
// Specific a11y descriptors
|
|
title = 'Stats Time Series Chart';
|
|
|
|
@computed('data.[]', 'xProp', 'yProp')
|
|
get description() {
|
|
const { xProp, yProp, data } = this;
|
|
const yRange = d3Array.extent(data, d => d[yProp]);
|
|
const xRange = d3Array.extent(data, d => d[xProp]);
|
|
const yFormatter = this.yFormat();
|
|
|
|
const duration = formatDuration(xRange[1] - xRange[0], 'ms', true);
|
|
|
|
return `Time series data for the last ${duration}, with values ranging from ${yFormatter(
|
|
yRange[0]
|
|
)} to ${yFormatter(yRange[1])}`;
|
|
}
|
|
|
|
@computed('data.[]', 'xProp', 'timeseries', 'yAxisOffset')
|
|
get xScale() {
|
|
const xProp = this.xProp;
|
|
const scale = this.timeseries ? d3Scale.scaleTime() : d3Scale.scaleLinear();
|
|
const data = this.data;
|
|
|
|
const [low, high] = d3Array.extent(data, d => d[xProp]);
|
|
const minLow = moment(high)
|
|
.subtract(5, 'minutes')
|
|
.toDate();
|
|
|
|
const extent = data.length ? [Math.min(low, minLow), high] : [minLow, new Date()];
|
|
scale.rangeRound([10, this.yAxisOffset]).domain(extent);
|
|
|
|
return scale;
|
|
}
|
|
|
|
@computed('data.[]', 'yProp', 'xAxisOffset')
|
|
get yScale() {
|
|
const yProp = this.yProp;
|
|
const yValues = (this.data || []).mapBy(yProp);
|
|
|
|
let [low, high] = [0, 1];
|
|
if (yValues.compact().length) {
|
|
[low, high] = d3Array.extent(yValues);
|
|
}
|
|
|
|
return d3Scale
|
|
.scaleLinear()
|
|
.rangeRound([this.xAxisOffset, 10])
|
|
.domain([Math.min(0, low), Math.max(1, high)]);
|
|
}
|
|
}
|