heatmap: fix tooltip decimals

This commit is contained in:
Alexander Zobnin 2017-06-27 13:13:50 +03:00 committed by Daniel Lee
parent b63d2b3279
commit 7c840cdf38
4 changed files with 20 additions and 9 deletions

View File

@ -25,3 +25,7 @@ export function tickStep(start: number, stop: number, count: number): number {
return stop < start ? -step1 : step1;
}
export function getScaledDecimals(decimals, tick_size) {
return decimals - Math.floor(Math.log(tick_size) / Math.LN10);
}

View File

@ -95,6 +95,8 @@ export class HeatmapCtrl extends MetricsPanelCtrl {
series: any;
timeSrv: any;
dataWarning: any;
decimals: number;
scaledDecimals: number;
/** @ngInject */
constructor($scope, $injector, private $rootScope, timeSrv) {

View File

@ -15,6 +15,7 @@ export class HeatmapTooltip {
tooltip: any;
scope: any;
dashboard: any;
panelCtrl: any;
panel: any;
heatmapPanel: any;
mouseOverBucket: boolean;
@ -23,6 +24,7 @@ export class HeatmapTooltip {
constructor(elem, scope) {
this.scope = scope;
this.dashboard = scope.ctrl.dashboard;
this.panelCtrl = scope.ctrl;
this.panel = scope.ctrl.panel;
this.heatmapPanel = elem;
this.mouseOverBucket = false;
@ -85,8 +87,10 @@ export class HeatmapTooltip {
let tooltipTimeFormat = 'YYYY-MM-DD HH:mm:ss';
let time = this.dashboard.formatDate(xData.x, tooltipTimeFormat);
let decimals = this.panel.tooltipDecimals || 5;
let valueFormatter = this.valueFormatter(decimals);
let decimals = this.panel.tooltipDecimals || this.panelCtrl.decimals;
let scaledDecimals = decimals - 2;
let valueFormatter = this.valueFormatter(decimals, scaledDecimals);
let tooltipHtml = `<div class="graph-tooltip-time">${time}</div>
<div class="heatmap-histogram"></div>`;
@ -220,13 +224,13 @@ export class HeatmapTooltip {
.style("top", top + "px");
}
valueFormatter(decimals) {
valueFormatter(decimals, scaledDecimals = null) {
let format = this.panel.yAxis.format;
return function(value) {
if (_.isInteger(value)) {
decimals = 0;
}
return kbn.valueFormats[format](value, decimals);
return kbn.valueFormats[format](value, decimals, scaledDecimals);
};
}
}

View File

@ -5,7 +5,7 @@ import $ from 'jquery';
import moment from 'moment';
import kbn from 'app/core/utils/kbn';
import {appEvents, contextSrv} from 'app/core/core';
import {tickStep} from 'app/core/utils/ticks';
import {tickStep, getScaledDecimals} from 'app/core/utils/ticks';
import d3 from 'd3';
import {HeatmapTooltip} from './heatmap_tooltip';
import {convertToCards, mergeZeroBuckets} from './heatmap_data_converter';
@ -134,6 +134,8 @@ export default function link(scope, elem, attrs, ctrl) {
let decimalsAuto = getPrecision(tick_interval);
let decimals = panel.yAxis.decimals === null ? decimalsAuto : panel.yAxis.decimals;
let scaledDecimals = getScaledDecimals(decimals, tick_interval);
ctrl.decimals = decimals;
ctrl.scaledDecimals = scaledDecimals;
// Set default Y min and max if no data
if (_.isEmpty(data.buckets)) {
@ -218,7 +220,10 @@ export default function link(scope, elem, attrs, ctrl) {
let decimalsAuto = getPrecision(y_min);
let decimals = panel.yAxis.decimals || decimalsAuto;
// TODO: calculate scaledDecimals for log scales using tick size (as in jquery.flot.js)
let scaledDecimals = decimals - 2;
ctrl.decimals = decimals;
ctrl.scaledDecimals = scaledDecimals;
data.yAxis = {
min: y_min,
@ -298,10 +303,6 @@ export default function link(scope, elem, attrs, ctrl) {
return tickValues;
}
function getScaledDecimals(decimals, tick_size) {
return decimals - Math.floor(Math.log(tick_size) / Math.LN10);
}
function tickValueFormatter(decimals, scaledDecimals = null) {
let format = panel.yAxis.format;
return function(value) {