@netdata/charts
Version:
Netdata frontend SDK and chart utilities
56 lines (55 loc) • 3.59 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.popoverGridColumns = exports.getPopoverWidth = exports.getPopoverFixedWidth = exports.getPopoverDimensionColumnWidth = void 0;
var _canvas = require("../../../helpers/canvas");
function _toConsumableArray(r) { return _arrayWithoutHoles(r) || _iterableToArray(r) || _unsupportedIterableToArray(r) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _iterableToArray(r) { if ("undefined" != typeof Symbol && null != r[Symbol.iterator] || null != r["@@iterator"]) return Array.from(r); }
function _arrayWithoutHoles(r) { if (Array.isArray(r)) return _arrayLikeToArray(r); }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
var popoverGridColumns = exports.popoverGridColumns = {
dimensionMin: "120px",
value: "156px",
unit: "44px",
anomaly: "44px",
info: "36px",
annotationsInfo: "70px"
};
var popoverLayout = {
maxWidthRatio: 0.6,
paddingX: 32,
dimensionNamePaddingX: 16,
dimensionNameFont: 'bold 11px -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, "Helvetica Neue", sans-serif',
fallbackCharacterWidth: 6.25,
fallbackViewportWidth: 1024
};
var toPixels = function toPixels(value) {
return Number.parseFloat(value) || 0;
};
var getViewportWidth = function getViewportWidth() {
return typeof window === "undefined" ? popoverLayout.fallbackViewportWidth : window.innerWidth;
};
var measureDimensionName = function measureDimensionName(text) {
var value = text || "";
var width = (0, _canvas.measureTextWidth)(value, popoverLayout.dimensionNameFont);
return width === null ? Array.from(value).length * popoverLayout.fallbackCharacterWidth : width;
};
var getPopoverFixedWidth = exports.getPopoverFixedWidth = function getPopoverFixedWidth(infoColumn) {
return popoverLayout.paddingX + toPixels(popoverGridColumns.value) + toPixels(popoverGridColumns.unit) + toPixels(popoverGridColumns.anomaly) + toPixels(infoColumn);
};
var getPopoverDimensionColumnWidth = exports.getPopoverDimensionColumnWidth = function getPopoverDimensionColumnWidth(names) {
var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
infoColumn = _ref.infoColumn,
viewportWidth = _ref.viewportWidth;
var minWidth = toPixels(popoverGridColumns.dimensionMin);
var fixedWidth = getPopoverFixedWidth(infoColumn || popoverGridColumns.info);
var maxWidth = Math.max(minWidth, Math.floor((viewportWidth || getViewportWidth()) * popoverLayout.maxWidthRatio - fixedWidth));
var contentWidth = Math.ceil(Math.max.apply(Math, [0].concat(_toConsumableArray(names.map(measureDimensionName))))) + popoverLayout.dimensionNamePaddingX;
return Math.min(Math.max(minWidth, contentWidth), maxWidth);
};
var getPopoverWidth = exports.getPopoverWidth = function getPopoverWidth(dimensionColumnWidth, infoColumn) {
return dimensionColumnWidth + getPopoverFixedWidth(infoColumn || popoverGridColumns.info);
};