Commit bf0d87aa by Hendrik van Huyssteen Committed by Torkel Ödegaard

Graph: Add fill gradient option to series override line fill (#20941)

parent 5e34e061
......@@ -276,6 +276,19 @@ describe('TimeSeries', () => {
});
});
describe('fillGradient', () => {
beforeEach(() => {
series.alias = 'test';
series.applySeriesOverrides([{ alias: 'test', fill: 10, fillGradient: 10 }]);
});
it('should set fillcolor to gradient', () => {
expect(series.lines.fillColor).toMatchObject({
colors: [{ opacity: 0.0 }, { opacity: 1 }],
});
});
});
describe('series option overrides, bars, true & lines false', () => {
beforeEach(() => {
series.alias = 'test';
......
......@@ -19,6 +19,16 @@ function translateFillOption(fill: number) {
return fill === 0 ? 0.001 : fill / 10;
}
function getFillGradient(amount: number) {
if (!amount) {
return null;
}
return {
colors: [{ opacity: 0.0 }, { opacity: amount / 10 }],
};
}
/**
* Calculate decimals for legend and update values for each series.
* @param data series data
......@@ -157,6 +167,9 @@ export default class TimeSeries {
if (override.fill !== void 0) {
this.lines.fill = translateFillOption(override.fill);
}
if (override.fillGradient !== void 0) {
this.lines.fillColor = getFillGradient(override.fillGradient);
}
if (override.stack !== void 0) {
this.stack = override.stack;
}
......
......@@ -79,7 +79,7 @@ class GraphCtrl extends MetricsPanelCtrl {
lines: true,
// fill factor
fill: 1,
// fill factor
// fill gradient
fillGradient: 0,
// line width in pixels
linewidth: 1,
......
......@@ -101,6 +101,7 @@ export function SeriesOverridesCtrl($scope: any, $element: JQuery, popoverSrv: a
$scope.addOverrideOption('Bars', 'bars', [true, false]);
$scope.addOverrideOption('Lines', 'lines', [true, false]);
$scope.addOverrideOption('Line fill', 'fill', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
$scope.addOverrideOption('Fill gradient', 'fillGradient', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
$scope.addOverrideOption('Line width', 'linewidth', [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10]);
$scope.addOverrideOption('Null point mode', 'nullPointMode', ['connected', 'null', 'null as zero']);
$scope.addOverrideOption('Fill below to', 'fillBelowTo', $scope.getSeriesNames());
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment