4

実装したFlotグラフの外側マージンを制御する方法を理解するのにいくつかの問題があります。私は多くのオプションを試しました。minBorderMargin、margin、axisMargin、labelMargin。個別に設定することも、すべて一緒に設定することも、何も変わりませんでした。

私が達成したいのは、右マージンの幅を完全に制御することです。

この例でわかるように、minBorderMarginが0（ゼロ）に設定されている場合でも、右側にマージンがあります。

ソースコードは次のとおりです。

var $wrapper = $('<div />').addClass('wrapper'),
    $graph = $('.graph'),
    data = {
        color: '#dba400', 
        hoverable: true,
        data: [
            // [1, 215000],
            // [2, 205000],
            // [3, 0],
            // [4, 70000],
            [35, 270000],
            [36, 105000],
            [37, 60000],
            [38, 0],
            [39, 110000]
        ]
    },
    options = {
        xaxis: {
            color: '#f0f0f0',
            min: 34.5,
            max: 39.5,
            tickColor: 'transparent',
            tickFormatter: function(val) {
                return 'RND' + val;
            }
        },
        yaxis: {
            color: '#f0f0f0',
            tickColor: null,
            tickFormatter: function(val) {
                var units = ['', 'K', 'M'],
                    unit = units.shift();

                while (val > 1000 && units.length > 0) {
                    val /= 1000;
                    unit = units.shift();
                }

                return val + unit;
            }
        },
        grid: {
            borderWidth: 0,
            minBorderMargin: 0
        },
        hooks: {
            processOffset: function(plot, offset) {
                console.log(plot, offset);
            }
        },
        series: {
            points: {
                radius: 0,
                lineWidth: 0
            }
        }
    };

$graph.append($wrapper);
$.plot($wrapper, [data], options);​

ボーナスの質問：最初の目盛りラベルを左揃えにし、最後の目盛りラベルを右揃えにする簡単な方法はありますか？

4

1 に答える 1

0

プロットを変更する方法が見つからない場合は、オーバーフローが非表示に設定されている別の div 内にプレースホルダー div を配置することを検討してください。次に、外側のdivのサイズまたは内側の配置を制御することにより、任意の側の余分なマージンを「切り落とす」ことができます。

于 2012-11-17T14:54:53.357 に答える