爲圖表生成標籤

我正在試圖找到一種用於爲我正在編寫的圖表引擎生成Y軸的算法，並且正在拔出毛髮階段。爲圖表生成標籤

搜索產量各種解決方案，但我努力找到一個迎合所有數據範圍。

這裏是我到目前爲止有：

// Raise the max and lower the min so that we get a prettier looking chart. 
var tickRangeMinMax = maxValue - minValue; 
var min = tickRangeMinMax * Math.round(minValue/tickRangeMinMax); 
var max = tickRangeMinMax * Math.round(1 + (maxValue/tickRangeMinMax));

這給了我，我想爲其生成一個Y軸的新範圍。

我計算每個Y軸標籤之間的距離如下：

var ticks = tickRange(min, max, labelCount); 

function tickRange(minVal, maxVal, tickCount) {   
    var range = maxVal - minVal; 
    var unRoundedTicksSize = range/(tickCount - 1); 
    var x = Math.ceil(log10(unRoundedTicksSize) - 1); 
    var pow10X = Math.pow(10, x); 
    var roundedTickRange = Math.ceil(unRoundedTicksSize/pow10X) * pow10X; 

    return roundedTickRange; 
}

我也嘗試使用更簡單的算法計算蜱：

return (max - min)/labelCount

前一種方法效果很好小範圍如23 - > 200然而，當我有一系列的說法，0 - > 3000時，這些方法都不適用於我。

在0 - > 3000的情況下， h在我的一些標籤中爲負值。

我通過循環遍歷labelCount來爲標籤集合添加標籤，在我的情況下爲5，並從前面的標籤值減去標籤範圍。我從最大值開始。

來源

2013-10-31 Jamie Dixon

這是什麼意思，不工作，看起來視覺上不愉快？ – chill

這意味着我在Y軸上得到負值。如果計算0 - > 3000的刻度範圍，並嘗試在labelCount上的循環中減去該刻度範圍，則會發現刻度範圍不會進入最大值labelCount次數。 –

對我來說，你的算法看起來不錯，只有我從範圍的低端開始，最後一個標籤可能高於範圍，這對於圖表來說不是問題IMO。 – chill

作爲參考，只有在Python（不講JS）和你的一樣：

import math 

def ticks (low, high, labels): 
     nlabels = len(labels) 
     tick = (high - low)/(nlabels - 1) 
     x = math.floor(math.log10(tick)) 
     pow10x = math.pow(10,x) 
     tick = int(math.ceil(tick/pow10x)*pow10x) 
     return zip (range(low,high+tick,tick), labels) 


print (ticks (0, 225, ['a', 'b', 'c', 'd', 'e']))

PS。也許floor對數更好

來源

2013-10-31 15:34:55 chill

爲圖表生成標籤

回答

相關問題