github.com/Ilhicas/nomad@v1.0.4-0.20210304152020-e86851182bc3/ui/app/components/stats-time-series.js (about)

     1  import Component from '@glimmer/component';
     2  import moment from 'moment';
     3  import d3TimeFormat from 'd3-time-format';
     4  import d3Format from 'd3-format';
     5  import { scaleTime, scaleLinear } from 'd3-scale';
     6  import d3Array from 'd3-array';
     7  import formatDuration from 'nomad-ui/utils/format-duration';
     8  
     9  export default class StatsTimeSeries extends Component {
    10    get xFormat() {
    11      return d3TimeFormat.timeFormat('%H:%M:%S');
    12    }
    13  
    14    get yFormat() {
    15      return d3Format.format('.1~%');
    16    }
    17  
    18    // Specific a11y descriptors
    19    get description() {
    20      const data = this.args.data;
    21      const yRange = d3Array.extent(data, d => d.percent);
    22      const xRange = d3Array.extent(data, d => d.timestamp);
    23      const yFormatter = this.yFormat;
    24  
    25      const duration = formatDuration(xRange[1] - xRange[0], 'ms', true);
    26  
    27      return `Time series data for the last ${duration}, with values ranging from ${yFormatter(
    28        yRange[0]
    29      )} to ${yFormatter(yRange[1])}`;
    30    }
    31  
    32    xScale(data, yAxisOffset) {
    33      const scale = scaleTime();
    34  
    35      const [low, high] = d3Array.extent(data, d => d.timestamp);
    36      const minLow = moment(high)
    37        .subtract(5, 'minutes')
    38        .toDate();
    39  
    40      const extent = data.length ? [Math.min(low, minLow), high] : [minLow, new Date()];
    41      scale.rangeRound([10, yAxisOffset]).domain(extent);
    42  
    43      return scale;
    44    }
    45  
    46    yScale(data, xAxisOffset) {
    47      const yValues = (data || []).mapBy('percent');
    48  
    49      let [low, high] = [0, 1];
    50      if (yValues.compact().length) {
    51        [low, high] = d3Array.extent(yValues);
    52      }
    53  
    54      return scaleLinear()
    55        .rangeRound([xAxisOffset, 10])
    56        .domain([Math.min(0, low), Math.max(1, high)]);
    57    }
    58  }