开发者

How to calculate axis ticks at a uniform distribution?

Given a data range by its minimum and maximum value, how can one calculate the distribution of buckets on a an axis?

The requirements are:

- The axis ticks shall be evenly distributed (equal size).

- Further, all ticks shall appear as numbers like 10, 20, 30, ... or -0.3, 0.1, 0.2, 0.4, ...

- The calculation shall accept a parameter that defines the number of buckets wanted.

The following example calculates a maximum of 10 buckets or less.

num buckets = 10
range length = 500
500 / 10 = 50
log_10(50) = 1,69
round up(1,69) = 2
10^2 = 100 bucket size
500 / 100 = 5 buckets

Resu开发者_开发问答lt: There are 5 buckets each at a size of 100.

The steps only produce buckets that are based on 10^x which are 0.01, 0.1, 1, 10, 100, 1000 ...

How can one calculate the buckets size for exactly 42 buckets?


I am not sure but i think this code can help you (Adapted from JavaScript YUI YAHOO.util.DragDrop.js)

var initPosition = 0;
var rangeLength  = 500;
var maxPosition  = (initPosition + rangeLength);
getTicks: function(bucketSize) {
    var axisTicks = [];

    var tickMap = {};
    for (i = initPosition; i <= maxPosition; i = i + bucketSize) {
        if (!tickMap[i]) {
            axisTicks[axisTicks.length] = i;

            tickMap[i] = true;
        }
    }

    return axisTicks;
}

The drawback is because, sometimes, the axis ticks will not be evenly distributed ((initPosition + rangeLength) / bucketSize) does not return a plain integer

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜