0

jqPlotのバーを対応するラベルに揃えることができません。私のチャートの画像をご覧ください。バーがラベルの真上に配置されていることを確認するにはどうすればよいですか?

ずれたバーを示す画像

チャートのレンダリングに使用するコードは次のとおりです。

function drawReadsChart(json) {
        var s1 = [['<%= GetText("Combo Total") %>', json.Data.Combo.Total]];
        var s2 = [['<%= GetText("Soil In Total") %>', json.Data.SoilIn.Uhf]];
        var s3 = [['<%= GetText("UHF") %>', json.Data.Combo.Uhf]];
        var s4 = [['<%= GetText("LF") %>', json.Data.Combo.Lf]];

        $.jqplot('chart', [s2, s3, s4, s1], {
            grid: {
                drawBorder: false,
                shadow: false
            },
            seriesDefaults: {
                renderer: $.jqplot.BarRenderer,
                rendererOptions: { fillToZero: true, shadow: false },
                pointLabels: { show: true }
            },

            series: [
                { color: '#68BA38' },
                { color: '#68BA38' },
                { color: '#28C9DE' },
                { color: '#2895DE' }
            ],
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer
                },
                yaxis: {
                    padMin: 0
                }
            }
        });
    }

編集:

私は4つのシリーズすべてを1つのシリーズに入れなければなりませんでした。その後、すべてが正しく整列しました。各バーに個別に色を割り当てることができるようにするには、BarRendererで「varyBarColor:true」を設定し、「seriesColors」も指定する必要がありました。意味がありませんが、機能します。

4

2 に答える 2

0

まず、divコンテナが通常必要なサイズよりも大きいことです。幅を狭くしてみてください。ラベルはデフォルトの中央に配置されますが、左右に移動できます。これtickOptions: { labelPosition: 'middle' }を使用してラベルを移動できます。このリンクも参照してくださいhttp://www.jqplot.com/tests/rotated-tick-labels.php

于 2012-04-18T12:01:13.137 に答える
0

私は4つのシリーズを1つのシリーズに組み合わせる必要がありました。このような:

var bars = [['<%= GetText("Soil In Total") %>', json.Data.SoilIn.Uhf, 
['<%= GetText("UHF") %>', json.Data.Combo.Uhf], 
['<%= GetText("LF") %>', json.Data.Combo.Lf], 
['<%= GetText("Combo Total") %>', json.Data.Combo.Total]];
于 2013-11-29T19:26:20.487 に答える