在這裏你可以看到一個使用graphael創建的圖表。 http://jsfiddle.net/aNJxf/4/怪異圖表最大軸x值(真正的挑戰)
正確顯示y軸。
第一個y值爲0.03100,y軸的最大值爲0.031 如果我們將該值更改爲0.03104,則y軸的最大值變爲1.03,現在我們所有的點都位於底部。 如果我們再添加一個0.00001,使得該值爲0.03105,那麼軸線y的最大值爲0.531,現在我們的點顯示在圖表的位置錯誤的錯誤位置上。 當graphael計算最大y軸值時,似乎出現了問題。
爲什麼會發生這種情況?我們如何解決這個問題?
,我已經貼有該代碼是
var r = Raphael("holder"),
txtattr = { font: "12px sans-serif" };
var x = [], y = [], y2 = [], y3 = [];
for (var i = 0; i < 1e6; i++) {
x[i] = i * 10;
y[i] = (y[i - 1] || 0) + (Math.random() * 7) - 3;
}
var demoX = [[1, 2, 3, 4, 5, 6, 7],[3.5, 4.5, 5.5, 6.5, 7, 8]];
var demoY = [[12, 32, 23, 15, 17, 27, 22], [10, 20, 30, 25, 15, 28]];
var xVals =[7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30,31,32,33,34,35,36,37,38,39,40,41,42,43,44,45,46,47,48,49,50,51,52,53,54,55,56,57,58];
var yVals = [0.03100,0.02259,0.02623,0.01967,0.01967,0.00788,0.02217,0.0137,0.,0.01764,0.0131,0.00942,0.0076,0.01463,0.02882,0.02093,0.02502,0.01961,0.01551,0.02227,0.0164,0.0191,0.00774,0.03076,0.0281,0.01338,0.02763,0.02334,0.00557,0.00023,0.01523,0.0263,0.03077,0.02404,0.02492,0.01954,0.01954,0.02337,0.01715,0.02271,0.00815,0.01343,0.00985,0.01837,0.00749,0.02967,0.01156,0.0083,0.00209,0.01538,0.01348,0.01353];
//r.text(160, 10, "Symbols, axis and hover effect").attr(txtattr);
var lines = r.linechart(10, 10, 300, 220, xVals, yVals, { nostroke: false, axis: "0 0 1 1", symbol: "circle", smooth: true })
.hoverColumn(function() {
this.tags = r.set();
for (var i = 0, ii = this.y.length; i < ii; i++) {
this.tags.push(r.tag(this.x, this.y[i], this.values[i], 160, 10).insertBefore(this).attr([{ fill: "#fff" }, { fill: this.symbols[i].attr("fill") }]));
}
}, function() {
this.tags && this.tags.remove();
});
lines.symbols.attr({ r: 3 });
感謝
一個類似的問題被問及並回答[這裏](http://stackoverflow.com/questions/21095968/why-the-following-data-produce-wrong-chart/21117316#21117316) – Legisey