0

作成するグラフの数が事前にわかっている場合に、1 つのページに複数のグラフを作成することについて多くの議論を見てきました。複数のアイテムをグラフ化する必要があるページを作成していますが、アイテムがいくつになるかは事前にわかりません。最後のグラフは常に表示されますが、前のグラフは表示されません。デバッグ時に、draw 関数が呼び出されるとすべてのグラフが表示されますが、次の draw 関数が呼び出されると表示されなくなります。ばかげているかもしれませんが、何時間も検索しましたが、わかりません。テスト環境 (バージョン 1.1) に変更すると、それらはすべて表示されますが、ホバーテキストは表示されません。助言がありますか？コードは全体の一部であるため、ハードコードされたデータを使用して要約バージョンを作成しようとしました。

<!DOCTYPE html> 
<html> 
<head> 
    <title>Summary</title> 
  <link href="assets/css/bootstrap.css" rel="stylesheet">
  <link href="assets/css/bootstrap-responsive.css" rel="stylesheet">
</head> 
<body> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        google.load('visualization', '1', {'packages':['corechart']});
        google.setOnLoadCallback(summary_go);

        function summary_go() {

            /* skipping a bunch of code that does some queries and pulls the data into arrays for the graphs */
            var graph_data = new Array(
                {title: "Potassium SerPl-sCnc",
                    head: ["Date","mmol/L"],
                    data: [[new Date("2004", "09", "23"),3.6],
                        [new Date("2005", "08", "31"),3.5],
                        [new Date("2007", "09", "01"),3.4],
                        [new Date("2008", "01", "11"),4.1],
                        [new Date("2009", "09", "30"),3.5]]},

                {title: "Albumin/Creat Ur-mRto",
                    head: ["Date","ug/mg{creat}"],
                    data: [[new Date("2004", "09", "23"),5],
                        [new Date("2009", "09", "30"),8]]});

            var labdiv = document.getElementById("lab-list");
            for (var i = 0; i < graph_data.length; i++) {
                labdiv.innerHTML += "<li>" + graph_data[i]['title'] + "<div id=\"" + graph_data[i]['title'] + "\"></div></li>";

                var dataTable = new google.visualization.DataTable();
                dataTable.addColumn('date', 'Date');
                dataTable.addColumn('number', 'Value');
          dataTable.addRows(graph_data[i]['data']);

                var chart = new google.visualization.LineChart(document.getElementById(graph_data[i]['title']));
                var options = {
                    vAxis: {title: graph_data[i]['head'][1]},
               legend: {position: 'none'},
          };

                chart.draw(dataTable, options);
            }
        }
    </script> 

    <div class="container-fluid">
        <div class="row-fluid">
            <div class="span12" id="lab-list">
                <h3>Patient Data</h3>
            </div>
        </div>
    </div><!--/.fluid-container-->

</body> 
</html>

ありがとう！

4

1 に答える 1

0

うーん、どうやら馬鹿げたことだったようだ。div タグはおそらく描画呼び出しに間に合わなかったので、別の外観に分割したとき、最初に div を設定し、次に描画呼び出しを呼び出すと、問題なく動作しました。

于 2012-08-19T19:53:01.210 に答える