1

私はいくつかの作業中の Jqplot チャートを持っており、数字が数千になったときに数字の末尾の 3 つのゼロを切り捨てたいと考えています。たとえば、私のグラフでは、1,500、15,000、および 150,000 の軸の目盛が表示されます。しかし、複数のグラフを含む私のページでは数字が長くなりすぎて快適に表示できない場合があるため、1.5k、15k、150k のように表示したいと思います。

このサイトの以前の回答から、Jqplot の formatString が sprintf 関数を使用していることがわかりました。それはかなり正しいですが、与えられた単純な例以外のより複雑な方法でそれらを使用する構文にはあまり慣れていません。

以下は、Y 軸で formatString を使用して 3 桁区切り記号を挿入する簡単なコード スニペットの例です。これは、数千を「K」に変換するために何らかの方法で変更できるか、または別の方法を検討する必要があるかどうか疑問に思っていることです。

options = {axes:{yaxis:{tickOptions:{formatString: "%'i"}}}}

$.jqplot('example',  [[[1,1000],[2,2000],[3,100000]]], options);
4

2 に答える 2

3

そのため、ここで formatString ( JQplot Format String )について説明している別の投稿のおかげで、これを理解することができました。

formatString を使用する代わりに、Jqplot が使用する独自のティック フォーマッタを単純に作成することが提案されましたが、私は知りませんでした。そこで、私が求めていた変換を実現するために次のように書きました (例: 1,000 から 1.0K、10,000 から 10K、1,000,000 から 1.0M など)。

tickFormatter = function (format, val) {
    if (val >= 1000000) {
        val = val / 1000000;
    return val.toFixed(1)+"M";
    } 
    if (val >= 1000) {
        val = val / 1000;
            if (val < 10) {
                return val.toFixed(1)+"K";
            }
        return val.toFixed(0)+"K";
    }
    return val;
}

options = {axes:{yaxis:{tickOptions:{formatter: tickFormatter}}}}

$.jqplot('example',  [[[1,1000],[2,2000],[3,100000]]], options);

私はかなり新しいので、経験豊富な人がフォーマッタを少しきれいにすることができると確信しています。しかし、これが実際の jsFiddle の例です: http://jsfiddle.net/planetxpress/jPexp/

于 2013-06-02T03:32:17.097 に答える
0

正数と負数の両方の書式設定を可能にするために、簡単な調整を行う必要がありました

                        tickFormatter = function (format, val) {
                        if (val >= 1000000 || val<-1000000) {  ///here
                            val = val / 1000000;
                            return val.toFixed(1)+"M";
                            } 
                        if (val >= 1000 || val<-1000) {  ///and here
                            val = val / 1000;
                                if (val < 10) {
                                    return val.toFixed(1)+"K";
                                }
                            return val.toFixed(0)+"K";
                        }
                        return val;
                    }
于 2014-06-19T09:56:59.710 に答える