1

Jquery UI タブで Google Visualization API 折れ線グラフを使用すると問題が発生します。

2 つのタブに 2 つのグラフがあります。デフォルトで表示される最初のグラフは問題なく表示されます。 ここに画像の説明を入力

非表示のタブの 2 番目のグラフは、キーを台無しにしているようです。 ここに画像の説明を入力

オプションを変更してみましたが、何も変わらないようです。ここに私のオプションがあります：

options = { 'title': title,
            titleTextStyle: { color: color, fontSize: 20 },
                'width': 950,
                'height': 400,
                hAxis: {
                    minorGridlines: {
                        count: x
                    }
                },
                chartArea:
                {
                    width: 880
                },
                legend: { position: 'bottom',
                    textStyle: { fontSize: 10 }
                }
            };
            // Instantiate and draw our chart, passing in some options.
            var chart = new google.visualization.LineChart(document.getElementById(divId));
            chart.draw(data, options);
$('#tabs').tabs();

これを引き起こしている原因とそれを防ぐ方法について何か考えはありますか??

編集

通話を削除すると、tabs()正しく表示されます。以下の@Vipulからの回答によると、divを固定幅に設定しようとしましたが、違いはありません。

4

1 に答える 1

1

あなたは試すことができます

  1. タブ div に固定幅を設定する

  2. 最初にグラフを描画してから、タブを作成します。

    setTimeout( function(){ /* そこにタブを作成するコードを書きます */},300);

于 2012-12-11T10:43:41.117 に答える