2016-12-10 20 views
-3

私はmorris.jsを使用して棒グラフを作成していますが、棒のサイズが広すぎます。 バーのサイズを制限するにはどうすればよいですか? Javaスクリプトコード棒グラフ横棒の幅私は水平棒ごとに固定幅または最大幅が必要です

var bar = new Morris.Bar({ 
     element: 'bar-chart', 
     resize: true, 
     data: [ 
     {y: '2012', a: 100, b: 90} 
     ], 
     barColors: ['#00a65a', '#f56954'], 
     xkey: 'y', 
     ykeys: ['a', 'b'], 
     labels: ['CPU', 'DISK'], 
     hideHover: 'auto' 
    }); 
+0

正確には間違っていますか?広すぎます?高すぎる?あなたのスケールがどのようなものか、どのように作成したのか、私たちは分かりません。あなたが投稿したものから私たちが知る唯一のものは、あなたが棒グラフを持っていることです。 –

+0

申し訳ありませんが、私は今質問に詳しい情報を追加しました。 –

+0

私はあなたの質問を編集していますが、他の人が行った重要な編集を取り消し、画像をリンクに戻しました(これをもう一度修正しました)。誰も画像を見るためにリンクをクリックする必要はありません。 –

答えて

2

あなたがバーの幅を制御するためにbarSizeRatioを使用することができますを使用して

You can find screen shot of chart here

。たとえば、バーが少ない場合などです。 5未満、barSizeRatioを0.2に設定します。 5つ以上のバーについては、barSizeRatioを指定しないで、チャートコントロールが把握できるようにします。

jsfiddle http://jsfiddle.net/bv4xezh7/1/

Morris.Bar({ 
barSizeRatio:0.2, 
    element: 'chart', 
    data: [ 
    { date: '04-02-2014', value: 3 }, 
    { date: '04-03-2014', value: 10 }, 

    ], 
    xkey: 'date', 
    ykeys: ['value'], 
    labels: ['Orders'] 
}); 

あなたは、チャートコントロールの幅を考え出すことで、それはよりダイナミックにすると、あなたの最大バー幅基準を満たすためにbarSizeRatioの値を決めることができます。

関連する問題