New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support auto grid min/max when using log scale #3090

Closed
Krinkle opened this Issue Oct 29, 2015 · 2 comments

Comments

Projects
None yet
4 participants
@Krinkle
Contributor

Krinkle commented Oct 29, 2015

When using log scale, it seems the auto grid min/max no longer works.

Here's an example graph using the default "auto" for the axis and a linear scale:

screen shot 2015-10-29 at 20 55 57

With the lowest value around 1.6s, the Y-axis naturally starts around 1s (not 0).

Here's another one:
screen shot 2015-10-29 at 21 02 20

But then when enabling the log scale, the graph essentially becomes unusable without some minimum value due to the long exponential onramp from 0 to 1 taking up the vast majority of the available screen space.

Log scale 2:
screen shot 2015-10-29 at 21 03 00

Log scale 10:
screen shot 2015-10-29 at 21 03 23

Log scale 1024:
screen shot 2015-10-29 at 21 03 09

I'm not sure if it's possible, but it'd be nice if it would result in something like this. (I've hardcoded a grid minimum of 300ms here).
screen shot 2015-10-29 at 21 04 57


Part of this was previously mentioned in #2829.

@torkelo

This comment has been minimized.

Show comment
Hide comment
@torkelo

torkelo Oct 30, 2015

Member

would be nice,

for anyone with time to give it a try, would love help :)
https://github.com/grafana/grafana/blob/master/public/app/panels/graph/graph.js#L390

Member

torkelo commented Oct 30, 2015

would be nice,

for anyone with time to give it a try, would love help :)
https://github.com/grafana/grafana/blob/master/public/app/panels/graph/graph.js#L390

@bigbenhur

This comment has been minimized.

Show comment
Hide comment
@bigbenhur

bigbenhur May 27, 2016

Contributor

Hi,

I'm not familiar enough with git to push this myself, but here's the fix in graph.js for this issue:
`

    function applyLogScale(axis, data) {
      if (axis.logBase === 1) {
        return;
      }
      if (axis.min < Number.MIN_VALUE) {
        axis.min = null
      }

      var series, i;
      var max = axis.max, min = axis.min;

      for (i = 0; i < data.length; i++) {
        series = data[i];
        if (series.yaxis === axis.index) {
          if (max === null || max < series.stats.max) {
            max = series.stats.max;
          }
          if (min === null || min > series.stats.min) {
            min = series.stats.min;
          }
        }
        if (max === void 0) {
          max = Number.MAX_VALUE;
        }
        if (min === void 0) {
          min = Number.MIN_VALUE;
        }
      }

      axis.transform = function(v) { return Math.log(v) / Math.log(axis.logBase); };
      axis.inverseTransform  = function (v) { return Math.pow(axis.logBase,v); };

      min = axis.inverseTransform(Math.floor(axis.transform(min)));
      max = axis.inverseTransform(Math.ceil(axis.transform(max)));

      axis.min = axis.min !== null ? axis.min : min;
      axis.max = axis.max !== null ? axis.max : max;

      axis.ticks = [];
      var nextTick;
      for (nextTick = min; nextTick <= max; nextTick *= axis.logBase) {
        axis.ticks.push(nextTick);
      }
    }

`

I tested it locally and would be grateful if somebody could test/push this code - cheers!

PS - On a related note: The number formatting for small numbers (e.g. 0.0000123) doesn't look good to me. Maybe adding an option to force exponential notation would improve things? By (ab-)using negative decimals for this, a single line in kbn.toFixed(value, decimals) would suffice:

if (decimals !== null && decimals < 0) return value.toExponential(-decimals);

Contributor

bigbenhur commented May 27, 2016

Hi,

I'm not familiar enough with git to push this myself, but here's the fix in graph.js for this issue:
`

    function applyLogScale(axis, data) {
      if (axis.logBase === 1) {
        return;
      }
      if (axis.min < Number.MIN_VALUE) {
        axis.min = null
      }

      var series, i;
      var max = axis.max, min = axis.min;

      for (i = 0; i < data.length; i++) {
        series = data[i];
        if (series.yaxis === axis.index) {
          if (max === null || max < series.stats.max) {
            max = series.stats.max;
          }
          if (min === null || min > series.stats.min) {
            min = series.stats.min;
          }
        }
        if (max === void 0) {
          max = Number.MAX_VALUE;
        }
        if (min === void 0) {
          min = Number.MIN_VALUE;
        }
      }

      axis.transform = function(v) { return Math.log(v) / Math.log(axis.logBase); };
      axis.inverseTransform  = function (v) { return Math.pow(axis.logBase,v); };

      min = axis.inverseTransform(Math.floor(axis.transform(min)));
      max = axis.inverseTransform(Math.ceil(axis.transform(max)));

      axis.min = axis.min !== null ? axis.min : min;
      axis.max = axis.max !== null ? axis.max : max;

      axis.ticks = [];
      var nextTick;
      for (nextTick = min; nextTick <= max; nextTick *= axis.logBase) {
        axis.ticks.push(nextTick);
      }
    }

`

I tested it locally and would be grateful if somebody could test/push this code - cheers!

PS - On a related note: The number formatting for small numbers (e.g. 0.0000123) doesn't look good to me. Maybe adding an option to force exponential notation would improve things? By (ab-)using negative decimals for this, a single line in kbn.toFixed(value, decimals) would suffice:

if (decimals !== null && decimals < 0) return value.toExponential(-decimals);

bigbenhur added a commit to bigbenhur/grafana that referenced this issue Jun 3, 2016

@daniellee daniellee closed this in #5278 Mar 13, 2017

daniellee added a commit that referenced this issue Mar 13, 2017

daniellee added a commit that referenced this issue Mar 13, 2017

@daniellee daniellee added this to the 4.3.0 milestone May 10, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment