0

2 つの Google チャートを含むサイクル/スライダーを作成しようとしています。以下のコードを使用してページに個別に表示できますが、スペースがプレミアムになったときに、スライダー/サイクルに移動することにしました。以下のコードで。最初のグラフは描画されますが、2 番目のグラフがスクロールして表示されます。チャートはありません。それはただ言う：Chromeで未定義またはnull参照のプロパティ「長さ」を取得できません：nullのプロパティ「長さ」を読み取れません。1 つのグラフが表示されているとき、もう 1 つのグラフは表示されていないことに気付きました。しかし、javascript に慣れていないため、適切なタイミングで display:'block' を display:'none に切り替えたり戻したりする答えを見つけるのが難しくなっています。どんな助けでも大歓迎です。

    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        function drawCharts() {
            var data1 = google.visualization.arrayToDataTable(<% =jsostring%>);
            var options1 = {
                title: 'PSNL Weight Chart',
                backgroundColor: {fill:'none'}
            };

            var data2 = google.visualization.arrayToDataTable(<% =jsostring2%>);
            var options2 = {
                title: 'PSNL Sleep Chart',
                backgroundColor: {fill:'none'}
            };

            var chartA = new google.visualization.LineChart(document.getElementById('chart_div'));
            chartA.draw(data1, options1);

            var chartB = new google.visualization.ColumnChart(document.getElementById('chart_div2'));
            chartB.draw(data2, options2);

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

       </script>
4

1 に答える 1

0

答えは非常に基本的なものだと思います。私はJavaの人ではありません。検索して考えてみました。別のサイトで見つけた答えは次のとおりです。

   <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">

        function drawCharts() {
            var data1 = google.visualization.arrayToDataTable(<% = jsostring%>);
            var options1 = {
                title: 'PSNL Weight Chart',
                backgroundColor: {fill:'none'}
            };

            var data2 = google.visualization.arrayToDataTable(<% = jsostring2%>);
            var options2 = {
                title: 'PSNL Sleep Chart',
                backgroundColor: {fill:'none'}
            };

            var chartA = new google.visualization.LineChart(document.getElementById('chart_div'));
            document.getElementById('chart_div').style.display = 'block';
            document.getElementById('chart_div2').style.display = 'none';
            chartA.draw(data1, options1);

            var chartB = new google.visualization.ColumnChart(document.getElementById('chart_div2'));
            document.getElementById('chart_div2').style.display = 'block';
            document.getElementById('chart_div').style.display = 'none';
            chartB.draw(data2, options2);
        }
        google.setOnLoadCallback(drawCharts);
        google.load("visualization", "1", { packages: ["corechart"] });

</script>

jqueryがスクロールするにつれて。スクロールして表示される前に、最初の Div_Chart をオンにし、もう一方をオフにします。

于 2013-07-30T13:59:17.830 に答える