IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

heatmap: fix Y axis and tooltip decimals and units issues

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
public/app/plugins/datasource/prometheus/datasource.ts
View File

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

2
public/app/plugins/panel/heatmap/heatmap_data_converter.ts
View File

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

10
public/app/plugins/panel/heatmap/heatmap_tooltip.ts
View File

@ -116,11 +116,12 @@ export class HeatmapTooltip {
if (yData) { if (yData) {
if (yData.bounds) { if (yData.bounds) {
if (data.tsBuckets) { if (data.tsBuckets) {
const decimals = this.panelCtrl.decimals || 0;
const tickFormatter = valIndex => { const tickFormatter = valIndex => {
let valueFormatted = data.tsBuckets[valIndex]; let valueFormatted = data.tsBuckets[valIndex];
if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') { if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') {
// Try to format numeric tick labels // Try to format numeric tick labels
valueFormatted = this.bucketBoundFormatter(0)(valueFormatted); valueFormatted = this.bucketBoundFormatter(decimals)(_.toNumber(valueFormatted));
} }
return valueFormatted; return valueFormatted;
}; };
@ -290,7 +291,12 @@ export class HeatmapTooltip {
bucketBoundFormatter(decimals, scaledDecimals = null) { bucketBoundFormatter(decimals, scaledDecimals = null) {
let format = this.panel.yAxis.format; let format = this.panel.yAxis.format;
return function(value) { 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;
}
}; };
} }
} }

12
public/app/plugins/panel/heatmap/partials/axes_editor.html
View File

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

22
public/app/plugins/panel/heatmap/rendering.ts
View File

@ -305,12 +305,15 @@ export default function link(scope, elem, attrs, ctrl) {
.range([chartHeight, 0]); .range([chartHeight, 0]);
const tick_values = _.map(tsBuckets, (b, i) => i); 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) { function tickFormatter(valIndex) {
let valueFormatted = tsBuckets[valIndex]; let valueFormatted = tsBuckets[valIndex];
if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') { if (!_.isNaN(_.toNumber(valueFormatted)) && valueFormatted !== '') {
// Try to format numeric tick labels // Try to format numeric tick labels
valueFormatted = tickValueFormatter(0)(valueFormatted); valueFormatted = tickValueFormatter(decimals)(_.toNumber(valueFormatted));
} }
return valueFormatted; return valueFormatted;
} }
@ -390,7 +393,12 @@ export default function link(scope, elem, attrs, ctrl) {
function tickValueFormatter(decimals, scaledDecimals = null) { function tickValueFormatter(decimals, scaledDecimals = null) {
let format = panel.yAxis.format; let format = panel.yAxis.format;
return function(value) { 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); return Math.log(value) / Math.log(base);
} }
function getPrecision(num) { function getPrecision(num: number): number {
let str = num.toString(); 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) { if (dot_index === -1) {
return 0; return 0;
} else { } else {
return str.length - dot_index - 1; return num.length - dot_index - 1;
} }
} }