flot の使い方.
X 軸と Y 軸を入れ替えるために,canvas の 2D context を rotate しようと試みたが,うまくいかなかった.$.plot()
に与えるデータ中で入れ替えれば良いが,hook processDatapoints
で入れ替えることもできる.
右から左に向かって増加する軸,上から下に向かって増加する軸を設定するために,transform
,inverseTransform
を用いようとしたが,うまくいかなかった.Flot Reference によれば,Flot assumes that the transform
function does not reorder values (monotonicity is assumed).
これを実現するためには,$.plot()
に与えるデータ中あるいは hook processDatapoints
で値の正負を逆転し,軸の tickFormatter
に正負を逆転した文字列を返すような関数を与える.
$.plot($( '#placeholder' ), data, {
hooks: {
processDatapoints: function( plot, series, datapoints ) {
var points = datapoints.points, ps = datapoints.pointsize;
for (var i = 0; i < points.length; i += ps) {
var x = points[i];
var y = points[i+1];
points[i] = y;
points[i+1] = -x;
}
}
}
yaxis: {
tickFormatter: function( val, axis ) { return -val; }
}
});