@netdata/charts
Version:
Netdata frontend SDK and chart utilities
527 lines (526 loc) • 25.3 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = void 0;
var _dygraphs = _interopRequireDefault(require("dygraphs"));
var _makeChartUI = _interopRequireDefault(require("../../sdk/makeChartUI"));
var _makeResizeObserver = _interopRequireDefault(require("../../helpers/makeResizeObserver"));
var _makeExecuteLatest = _interopRequireDefault(require("../../helpers/makeExecuteLatest"));
var _heatmap = require("../../helpers/heatmap");
var _plotters = require("./plotters");
var _tickers = require("./tickers");
var _navigation = _interopRequireDefault(require("./navigation"));
var _hoverX = _interopRequireDefault(require("./hoverX"));
var _overlays = _interopRequireDefault(require("./overlays"));
var _crosshair = _interopRequireDefault(require("./crosshair"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
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 _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 _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
var touchEvents = ["touchstart", "touchmove", "touchend"];
var _default = exports["default"] = function _default(sdk, chart) {
var chartUI = (0, _makeChartUI["default"])(sdk, chart);
var dygraph = null;
var listeners = [];
var navigation = null;
var hoverX = null;
var resizeObserver = null;
var overlays = null;
var executeLatest = null;
var mount = function mount(element) {
if (dygraph) return;
chartUI.mount(element);
var theme = chart.getAttribute("theme");
element.classList.add(theme);
var attributes = chart.getAttributes();
var _chart$getPayload = chart.getPayload(),
data = _chart$getPayload.data,
labels = _chart$getPayload.labels;
executeLatest = (0, _makeExecuteLatest["default"])();
var isEmpty = attributes.outOfLimits || data.length === 0;
dygraph = new _dygraphs["default"](element, isEmpty ? [[0]] : data, _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
// timingName: chart.getId(),
legend: "never",
showLabelsOnHighlight: false,
labels: isEmpty ? ["X"] : labels,
dateWindow: chart.getDateWindow(),
clickCallback: executeLatest.add(function () {
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return chartUI.trigger.apply(chartUI, ["click"].concat(args));
}),
highlightCallback: executeLatest.add(function () {
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
args[_key2] = arguments[_key2];
}
return chartUI.trigger.apply(chartUI, ["highlightCallback"].concat(args));
}),
unhighlightCallback: executeLatest.add(function () {
return chartUI.trigger("unhighlightCallback");
}),
drawCallback: function drawCallback() {
for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
args[_key3] = arguments[_key3];
}
return chartUI.trigger.apply(chartUI, ["drawCallback"].concat(args));
},
underlayCallback: executeLatest.add(function () {
for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
args[_key4] = arguments[_key4];
}
return chartUI.trigger.apply(chartUI, ["underlayCallback"].concat(args));
}),
interactionModel: {
willDestroyContextMyself: true,
mouseout: function mouseout() {
for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
args[_key5] = arguments[_key5];
}
return chartUI.trigger.apply(chartUI, ["mouseout"].concat(args));
},
mousedown: executeLatest.add(function () {
for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
args[_key6] = arguments[_key6];
}
return chartUI.trigger.apply(chartUI, ["mousedown"].concat(args));
}),
mousemove: function mousemove() {
for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
args[_key7] = arguments[_key7];
}
return chartUI.trigger.apply(chartUI, ["mousemove"].concat(args));
},
mouseover: function mouseover() {
for (var _len8 = arguments.length, args = new Array(_len8), _key8 = 0; _key8 < _len8; _key8++) {
args[_key8] = arguments[_key8];
}
return chartUI.trigger.apply(chartUI, ["mouseover"].concat(args));
},
mouseup: function mouseup() {
for (var _len9 = arguments.length, args = new Array(_len9), _key9 = 0; _key9 < _len9; _key9++) {
args[_key9] = arguments[_key9];
}
return chartUI.trigger.apply(chartUI, ["mouseup"].concat(args));
},
touchstart: function touchstart() {
for (var _len10 = arguments.length, args = new Array(_len10), _key10 = 0; _key10 < _len10; _key10++) {
args[_key10] = arguments[_key10];
}
return chartUI.trigger.apply(chartUI, ["touchstart"].concat(args));
},
touchmove: function touchmove() {
for (var _len11 = arguments.length, args = new Array(_len11), _key11 = 0; _key11 < _len11; _key11++) {
args[_key11] = arguments[_key11];
}
return chartUI.trigger.apply(chartUI, ["touchmove"].concat(args));
},
touchend: function touchend() {
for (var _len12 = arguments.length, args = new Array(_len12), _key12 = 0; _key12 < _len12; _key12++) {
args[_key12] = arguments[_key12];
}
return chartUI.trigger.apply(chartUI, ["touchend"].concat(args));
},
dblclick: executeLatest.add(function () {
for (var _len13 = arguments.length, args = new Array(_len13), _key13 = 0; _key13 < _len13; _key13++) {
args[_key13] = arguments[_key13];
}
return chartUI.trigger.apply(chartUI, ["dblclick"].concat(args));
}),
wheel: function wheel() {
for (var _len14 = arguments.length, args = new Array(_len14), _key14 = 0; _key14 < _len14; _key14++) {
args[_key14] = arguments[_key14];
}
return chartUI.trigger.apply(chartUI, ["wheel"].concat(args));
}
},
series: _objectSpread(_objectSpread({}, attributes.showAnomalies && {
ANOMALY_RATE: {
plotter: (0, _plotters.makeAnomalyPlotter)(chartUI),
drawPoints: false,
pointSize: 0,
highlightCircleSize: 0
}
}), attributes.showAnnotations && {
ANNOTATIONS: {
plotter: (0, _plotters.makeAnnotationsPlotter)(chartUI),
drawPoints: false,
pointSize: 0,
highlightCircleSize: 0
}
}),
strokeBorderWidth: 0,
axisLabelFontSize: attributes.axisLabelFontSize,
axisLineWidth: 1,
gridLineWidth: 1,
maxNumberWidth: 8,
highlightSeriesBackgroundAlpha: 1,
drawGapEdgePoints: true,
ylabel: chart.getAttribute("hasYlabel") && chart.getUnitSign({
"long": true
}),
digitsAfterDecimal: chart.getAttribute("unitsConversionFractionDigits")[0] < 0 ? 0 : chart.getAttribute("unitsConversionFractionDigits")[0],
yLabelWidth: 12,
yRangePad: 15,
labelsSeparateLines: true,
rightGap: -5
}, makeChartTypeOptions()), makeThemingOptions()), makeVisibilityOptions()), makeDataOptions()), makeSparklineOptions()), makeColorOptions()));
resizeObserver = (0, _makeResizeObserver["default"])(element, function () {
return chartUI.trigger("resize");
}, function () {
return chartUI.trigger("resize");
});
touchEvents.forEach(function (eventType) {
element.addEventListener(eventType, function (event) {
event.preventDefault();
}, {
passive: false
});
});
hoverX.toggle(attributes.enabledHover);
navigation.toggle(attributes.enabledNavigation, attributes.navigation);
listeners = [chartUI.on("resize", function () {
return dygraph.resize();
}), chart.onAttributeChange("hoverX", function (dimensions) {
var row = Array.isArray(dimensions) ? chart.getClosestRow(dimensions[0]) : -1;
if (row === -1) return dygraph.setSelection();
(0, _crosshair["default"])(instance, row);
}), chart.onAttributeChange("clickX", function (dimensions) {
var row = Array.isArray(dimensions) ? chart.getClosestRow(dimensions[0]) : -1;
if (row === -1) return dygraph.setSelection();
(0, _crosshair["default"])(instance, row, "click");
}), chart.onAttributeChange("enabledHover", hoverX.toggle), chart.onAttributeChange("enabledNavigation", navigation.toggle), chart.onAttributeChange("navigation", navigation.set), chart.onAttributeChange("overlays", overlays.toggle), chart.onAttributeChange("draftAnnotation", overlays.toggle), chart.onAttributeChange("theme", function (nextTheme, prevTheme) {
element.classList.remove(prevTheme);
element.classList.add(nextTheme);
dygraph.updateOptions(makeThemingOptions());
}), chart.onAttributeChange("chartType", function () {
if (chart.getAttribute("processing")) return;
dygraph.updateOptions(makeChartTypeOptions());
}), chart.onAttributeChange("selectedLegendDimensions", function () {
if (chart.getAttribute("processing")) return;
dygraph.updateOptions(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, makeVisibilityOptions()), makeColorOptions()), makeChartTypeOptions()), {}, {
digitsAfterDecimal: chart.getAttribute("unitsConversionFractionDigits")[0] < 0 ? 0 : chart.getAttribute("unitsConversionFractionDigits")[0]
}));
}), chart.onAttributeChange("staticValueRange", function (staticValueRange) {
if (!staticValueRange) {
dygraph.updateOptions({
valueRange: attributes.getValueRange(chart, {
dygraph: true
})
});
return;
}
var _staticValueRange = _slicedToArray(staticValueRange, 2),
min = _staticValueRange[0],
max = _staticValueRange[1];
dygraph.updateOptions({
valueRange: (0, _heatmap.isHeatmap)(attributes.chartType) ? [Math.ceil(min), Math.ceil(max)] : attributes.getValueRange(chart, {
dygraph: true
})
});
}), chart.onAttributeChange("timezone", function () {
return dygraph.updateOptions({});
})].filter(Boolean);
overlays.toggle();
chartUI.render();
};
var plotterByChartType = {
line: (0, _plotters.makeLinePlotter)(chartUI),
stackedBar: (0, _plotters.makeStackedBarPlotter)(chartUI),
multiBar: (0, _plotters.makeMultiColumnBarPlotter)(chartUI),
heatmap: (0, _plotters.makeHeatmapPlotter)(chartUI),
"default": null
};
var prevMin;
var prevMax;
var defaultOptions = {
yRangePad: 15,
strokeWidth: 0.7,
fillAlpha: 0.2,
fillGraph: false,
stackedGraph: false,
forceIncludeZero: false,
errorBars: false,
makeYAxisLabelFormatter: function makeYAxisLabelFormatter() {
return function (y, granularity, opts, d) {
var dataMin = chart.getAttribute("min");
var dataMax = chart.getAttribute("max");
var _ref = d.axes_[0].valueRange || [null, null],
_ref2 = _slicedToArray(_ref, 2),
min = _ref2[0],
max = _ref2[1];
min = min === null ? dataMin : min;
max = max === null ? dataMax : max;
if (min !== prevMin || max !== prevMax) {
prevMin = min;
prevMax = max;
chart.trigger("yAxisChange", min, max);
}
return chart.getConvertedValue(y); // TODO Pass { dimensionId: context.id } when multiple contexts with different units
};
},
makeYTicker: function makeYTicker() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return function (a, b, pixels, opts, dygraph, vals) {
return (0, _tickers.numericTicker)(a, b, pixels, opts, dygraph, vals, options);
};
},
highlightCircleSize: 4
};
var optionsByChartType = {
line: _objectSpread(_objectSpread({}, defaultOptions), {}, {
strokeWidth: 1.5,
fillAlpha: 0.2
}),
stacked: _objectSpread(_objectSpread({}, defaultOptions), {}, {
strokeWidth: 0.1,
fillAlpha: 0.8,
fillGraph: true,
stackedGraph: true,
forceIncludeZero: true
}),
area: _objectSpread(_objectSpread({}, defaultOptions), {}, {
fillGraph: true,
forceIncludeZero: true
}),
stackedBar: _objectSpread(_objectSpread({}, defaultOptions), {}, {
stackedGraph: true,
forceIncludeZero: true
}),
heatmap: _objectSpread(_objectSpread({}, defaultOptions), {}, {
makeYAxisLabelFormatter: function makeYAxisLabelFormatter() {
return function (y) {
var min = chart.getAttribute("min");
var max = chart.getAttribute("max");
if (min !== prevMin || max !== prevMax) {
prevMin = min;
prevMax = max;
chart.trigger("yAxisChange", min, max);
}
var value = parseFloat(parseFloat(y).toFixed(5));
return isNaN(value) ? y : value;
};
},
makeYTicker: function makeYTicker() {
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
return function (a, b, pixels, opts, dygraph, vals) {
return (0, _tickers.heatmapTicker)(a, b, pixels, opts, dygraph, vals, options);
};
},
highlightCircleSize: 0
}),
"default": _objectSpread({}, defaultOptions)
};
var makeChartTypeOptions = function makeChartTypeOptions() {
var _chart$getPayload2 = chart.getPayload(),
labels = _chart$getPayload2.labels;
var _chart$getAttributes = chart.getAttributes(),
chartType = _chart$getAttributes.chartType,
includeZero = _chart$getAttributes.includeZero,
enabledXAxis = _chart$getAttributes.enabledXAxis,
enabledYAxis = _chart$getAttributes.enabledYAxis,
yAxisLabelWidth = _chart$getAttributes.yAxisLabelWidth;
var plotter = plotterByChartType[chartType] || plotterByChartType["default"];
var _ref3 = optionsByChartType[chartType] || optionsByChartType["default"],
strokeWidth = _ref3.strokeWidth,
fillAlpha = _ref3.fillAlpha,
fillGraph = _ref3.fillGraph,
stackedGraph = _ref3.stackedGraph,
forceIncludeZero = _ref3.forceIncludeZero,
makeYAxisLabelFormatter = _ref3.makeYAxisLabelFormatter,
errorBars = _ref3.errorBars,
makeYTicker = _ref3.makeYTicker,
highlightCircleSize = _ref3.highlightCircleSize,
yRangePad = _ref3.yRangePad;
var yAxisLabelFormatter = makeYAxisLabelFormatter(labels);
var yTicker = makeYTicker ? makeYTicker({
labels: chart.getVisibleDimensionIds(),
units: chart.getUnits()
}) : null;
var _chart$getAttributes2 = chart.getAttributes(),
selectedLegendDimensions = _chart$getAttributes2.selectedLegendDimensions;
var dimensionIds = chart.getPayloadDimensionIds();
return {
yRangePad: yRangePad,
stackedGraph: stackedGraph,
fillGraph: fillGraph,
fillAlpha: fillAlpha,
highlightCircleSize: highlightCircleSize,
strokeWidth: strokeWidth,
includeZero: includeZero || forceIncludeZero && dimensionIds.length > 1 && selectedLegendDimensions.length > 1,
stackedGraphNaNFill: "none",
plotter: plotter,
errorBars: errorBars,
axes: {
x: enabledXAxis ? {
ticker: _dygraphs["default"].dateTicker,
axisLabelFormatter: chart.formatXAxis,
axisLabelWidth: 60
} : {
drawAxis: false
},
y: enabledYAxis ? _objectSpread(_objectSpread(_objectSpread({}, yTicker && {
ticker: yTicker
}), {}, {
axisLabelFormatter: yAxisLabelFormatter
}, yAxisLabelWidth && {
axisLabelWidth: yAxisLabelWidth
}), {}, {
pixelsPerLabel: 15
}) : {
drawAxis: false
}
},
ylabel: chart.getAttribute("hasYlabel") && chart.getUnitSign({
"long": true,
withoutConversion: (0, _heatmap.isHeatmap)(chartType)
})
};
};
var makeThemingOptions = function makeThemingOptions() {
var themeGridColor = chartUI.chart.getThemeAttribute("themeGridColor");
return {
axisLineColor: themeGridColor,
gridLineColor: themeGridColor
};
};
var makeVisibilityOptions = function makeVisibilityOptions() {
var dimensionIds = chart.getPayloadDimensionIds();
var payloadDimensions = chart.getPayload().labels;
if (!(dimensionIds !== null && dimensionIds !== void 0 && dimensionIds.length) || !(payloadDimensions !== null && payloadDimensions !== void 0 && payloadDimensions.length)) return {
visibility: false
};
var arrayLength = payloadDimensions.length - dimensionIds.length;
var suffixLabels = Array(arrayLength > 0 ? arrayLength : 0).fill(true);
var selectedLegendDimensions = chart.getAttribute("selectedLegendDimensions");
var visibility = [].concat(_toConsumableArray(dimensionIds.map(selectedLegendDimensions.length ? chart.isDimensionVisible : function () {
return true;
})), _toConsumableArray(suffixLabels));
return {
visibility: visibility
};
};
var makeDataOptions = function makeDataOptions() {
var _chart$getAttributes3 = chart.getAttributes(),
outOfLimits = _chart$getAttributes3.outOfLimits,
getValueRange = _chart$getAttributes3.getValueRange,
staticValueRange = _chart$getAttributes3.staticValueRange,
chartType = _chart$getAttributes3.chartType;
var _chart$getPayload3 = chart.getPayload(),
data = _chart$getPayload3.data,
labels = _chart$getPayload3.labels;
var dateWindow = chart.getDateWindow();
var isEmpty = outOfLimits || data.length === 0;
return {
file: isEmpty ? [[0]] : data,
labels: isEmpty ? ["X"] : labels,
dateWindow: dateWindow,
valueRange: staticValueRange ? staticValueRange : (0, _heatmap.isHeatmap)(chartType) ? [0, chart.getVisibleDimensionIds().length] : getValueRange(chart, {
dygraph: true
})
};
};
var makeSparklineOptions = function makeSparklineOptions() {
if (!chart.isSparkline()) return null;
return {
drawGrid: false,
drawAxis: false,
ylabel: undefined,
yLabelWidth: 0,
highlightCircleSize: 3,
fillAlpha: 1,
strokeWidth: 0
};
};
var makeColorOptions = function makeColorOptions() {
var dimensionIds = chart.getPayloadDimensionIds();
if (!dimensionIds.length) return {};
var colors = dimensionIds.map(function (id) {
return chart.selectDimensionColor(id);
});
return {
colors: colors
};
};
var unmount = function unmount() {
if (!dygraph) return;
if (executeLatest) executeLatest.clear();
resizeObserver();
listeners.forEach(function (listener) {
return listener();
});
listeners = [];
chartUI.unmount();
hoverX.destroy();
navigation.destroy();
dygraph.destroy();
dygraph = null;
overlays.destroy();
};
var getDygraph = function getDygraph() {
return dygraph;
};
var render = function render() {
if (!dygraph) return;
var _chart$getAttributes4 = chart.getAttributes(),
highlighting = _chart$getAttributes4.highlighting,
panning = _chart$getAttributes4.panning,
processing = _chart$getAttributes4.processing;
if (highlighting || panning || processing) return;
chartUI.render();
dygraph.updateOptions(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, makeDataOptions()), makeVisibilityOptions()), makeColorOptions()), makeChartTypeOptions()), {}, {
digitsAfterDecimal: chart.getAttribute("unitsConversionFractionDigits")[0] < 0 ? 0 : chart.getAttribute("unitsConversionFractionDigits")[0]
}, makeSparklineOptions()));
chartUI.trigger("rendered");
};
var getPreceded = function getPreceded() {
if (!dygraph) return -1;
var firstEntryMs = chart.getFirstEntry() * 1000;
var _dygraph$xAxisRange = dygraph.xAxisRange(),
_dygraph$xAxisRange2 = _slicedToArray(_dygraph$xAxisRange, 1),
after = _dygraph$xAxisRange2[0];
if (firstEntryMs < after) return -1;
var _dygraph$xAxisExtreme = dygraph.xAxisExtremes(),
_dygraph$xAxisExtreme2 = _slicedToArray(_dygraph$xAxisExtreme, 1),
afterExtreme = _dygraph$xAxisExtreme2[0];
return dygraph.toDomXCoord(afterExtreme);
};
var getChartWidth = function getChartWidth() {
return dygraph ? dygraph.getArea().w : chartUI.getChartWidth();
};
var getChartHeight = function getChartHeight() {
return dygraph ? dygraph.getArea().h : 100;
};
var getXAxisRange = function getXAxisRange() {
var _dygraph;
return (_dygraph = dygraph) === null || _dygraph === void 0 ? void 0 : _dygraph.xAxisRange();
};
var instance = _objectSpread(_objectSpread({}, chartUI), {}, {
getChartWidth: getChartWidth,
getChartHeight: getChartHeight,
getPreceded: getPreceded,
mount: mount,
unmount: unmount,
getDygraph: getDygraph,
getXAxisRange: getXAxisRange,
render: render
});
navigation = (0, _navigation["default"])(instance);
hoverX = (0, _hoverX["default"])(instance);
overlays = (0, _overlays["default"])(instance);
return instance;
};