heatmap: fix Y axis and tooltip decimals and units issues

This commit is contained in:
Alexander Zobnin 2018-03-07 13:28:44 +03:00
parent 0912f61ea3
commit a791a92d79
5 changed files with 33 additions and 15 deletions

View File

@ -470,5 +470,5 @@ function parseHistogramLabel(le: string): number {
if (le === '+Inf') {
return +Infinity;
}
return parseInt(le);
return Number(le);
}

View File

@ -86,7 +86,7 @@ function parseHistogramLabel(label: string): number {
if (label === '+Inf') {
return +Infinity;
}
return parseInt(label);
return Number(label);
}
/**

View File

@ -116,11 +116,12 @@ export class HeatmapTooltip {
if (yData) {
if (yData.bounds) {
if (data.tsBuckets) {
const decimals = this.panelCtrl.decimals || 0;
const tickFormatter = valIndex => {
let valueFormatted = data.tsBuckets[valIndex];
if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') {
// Try to format numeric tick labels
valueFormatted = this.bucketBoundFormatter(0)(valueFormatted);
valueFormatted = this.bucketBoundFormatter(decimals)(_.toNumber(valueFormatted));
}
return valueFormatted;
};
@ -290,7 +291,12 @@ export class HeatmapTooltip {
bucketBoundFormatter(decimals, scaledDecimals = null) {
let format = this.panel.yAxis.format;
return function(value) {
return kbn.valueFormats[format](value, decimals, scaledDecimals);
try {
return format !== 'none' ? kbn.valueFormats[format](value, decimals, scaledDecimals) : value;
} catch (err) {
console.error(err.message || err);
return value;
}
};
}
}

View File

@ -24,12 +24,12 @@
<label class="gf-form-label width-8">Y-Max</label>
<input type="text" class="gf-form-input width-12" placeholder="auto" empty-to-null ng-model="ctrl.panel.yAxis.max" ng-change="ctrl.render()" ng-model-onblur>
</div>
<div class="gf-form">
<label class="gf-form-label width-8">Decimals</label>
<input type="number" class="gf-form-input width-12" placeholder="auto" data-placement="right"
bs-tooltip="'Override automatic decimal precision for axis.'"
ng-model="ctrl.panel.yAxis.decimals" ng-change="ctrl.render()" ng-model-onblur>
</div>
</div>
<div class="gf-form">
<label class="gf-form-label width-8">Decimals</label>
<input type="number" class="gf-form-input width-12" placeholder="auto" data-placement="right"
bs-tooltip="'Override automatic decimal precision for axis.'"
ng-model="ctrl.panel.yAxis.decimals" ng-change="ctrl.render()" ng-model-onblur>
</div>
</div>

View File

@ -305,12 +305,15 @@ export default function link(scope, elem, attrs, ctrl) {
.range([chartHeight, 0]);
const tick_values = _.map(tsBuckets, (b, i) => i);
const decimalsAuto = _.max(_.map(tsBuckets, getStringPrecision));
const decimals = panel.yAxis.decimals === null ? decimalsAuto : panel.yAxis.decimals;
ctrl.decimals = decimals;
function tickFormatter(valIndex) {
let valueFormatted = tsBuckets[valIndex];
if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') {
// Try to format numeric tick labels
valueFormatted = tickValueFormatter(0)(valueFormatted);
valueFormatted = tickValueFormatter(decimals)(_.toNumber(valueFormatted));
}
return valueFormatted;
}
@ -390,7 +393,12 @@ export default function link(scope, elem, attrs, ctrl) {
function tickValueFormatter(decimals, scaledDecimals = null) {
let format = panel.yAxis.format;
return function(value) {
return kbn.valueFormats[format](value, decimals, scaledDecimals);
try {
return format !== 'none' ? kbn.valueFormats[format](value, decimals, scaledDecimals) : value;
} catch (err) {
console.error(err.message || err);
return value;
}
};
}
@ -849,12 +857,16 @@ function logp(value, base) {
return Math.log(value) / Math.log(base);
}
function getPrecision(num) {
function getPrecision(num: number): number {
let str = num.toString();
let dot_index = str.indexOf('.');
return getStringPrecision(str);
}
function getStringPrecision(num: string): number {
let dot_index = num.indexOf('.');
if (dot_index === -1) {
return 0;
} else {
return str.length - dot_index - 1;
return num.length - dot_index - 1;
}
}