@netdata/charts/dist/es6/chartLibraries/dygraph/plotters/anomaly.js

Netdata frontend SDK and chart utilities

import { scaleLinear } from "d3-scale";
import { getRowPointValue } from "../../../sdk/makeChart/getPointValue";
export default (function (chartUI) {
  return function (plotter) {
    if (!chartUI) return;

    // We need to handle all the series simultaneously.

    if (plotter.setName === "ANOMALY_RATE") {
      var ctx = plotter.drawingContext;
      var points = plotter.points;
      if (!points.length || !points[1]) return;
      var min_sep = points[1].canvasx - points[0].canvasx + 1;
      var bar_width = Math.floor(min_sep);
      var getColor = scaleLinear().domain([0, 100]).range(["transparent", chartUI.chart.getThemeAttribute("themeAnomalyScaleColor")]);
      var dimensionIds = chartUI.chart.getPayloadDimensionIds();
      var selectedLegendDimensions = chartUI.chart.getAttribute("selectedLegendDimensions");
      var selectedIdsSet = dimensionIds.reduce(function (h, id, index) {
        if (!selectedLegendDimensions.length) {
          h.add(index);
        } else {
          if (chartUI.chart.isDimensionVisible(id)) h.add(index);
        }
        return h;
      }, new Set());
      var _chartUI$chart$getPay = chartUI.chart.getPayload(),
        all = _chartUI$chart$getPay.all,
        point = _chartUI$chart$getPay.point;
      points.forEach(function (p) {
        var center_x = p.canvasx;
        var row = chartUI.chart.getClosestRow(p.xval);
        var pointData = all[row];
        var value = 0;
        selectedIdsSet.forEach(function (index) {
          var anomalyRate = getRowPointValue(pointData, index + 1, point, "arp") || 0;
          if (anomalyRate > value) value = anomalyRate;
        });
        ctx.strokeStyle = ctx.fillStyle = getColor(value);
        ctx.fillRect(center_x - bar_width / 2, 0, bar_width, 15);
        ctx.strokeRect(center_x - bar_width / 2, 0, bar_width, 15);
      });
    }
  };
});