Google visualization 谷歌多数据折线图_Google Visualization

Google visualization 谷歌多数据折线图

google-visualization

Google visualization 谷歌多数据折线图,google-visualization,Google Visualization,下面生成google折线图的代码可以很好地使用2个值（日期和平均值）。当我添加更多数据（包括模式和方差，如下所示）时，它只显示原始数据（日期和平均值）。其他数据不显示。我做错了什么？请我还在学习谷歌图表。任何帮助都将不胜感激。谢谢 <?php $servername = "localhost"; $username = "root"; $password = ""; $dbname = "mydb"; $con = new mysqli($

下面生成google折线图的代码可以很好地使用2个值（日期和平均值）。当我添加更多数据（包括模式和方差，如下所示）时，它只显示原始数据（日期和平均值）。其他数据不显示。我做错了什么？请我还在学习谷歌图表。任何帮助都将不胜感激。谢谢

<?php

    $servername = "localhost";
    $username = "root";
    $password = ""; 
    $dbname = "mydb";  

    $con = new mysqli($servername, $username, $password, $dbname);

    if ($con->connect_error) {
        die("Connection failed: " . $con->connect_error);
    }
    else
    {
);
    }
    $query = "SELECT Date, Mean, Mode, Variance FROM datatb";  
    $aresult = $con->query($query);

?>

<!DOCTYPE html>
<html>
<head>
    <title>Multiple Data</title>
    <script type="text/javascript" src="loader.js"></script>
    <script type="text/javascript">
        google.charts.load('current', {'packages':['corechart']});

        google.charts.setOnLoadCallback(drawChart);
        function drawChart(){

            var data = new google.visualization.DataTable();
            var data = google.visualization.arrayToDataTable([

                ['Date','Mean','Mode','Variance'],
                <?php
                    while($row = mysqli_fetch_assoc($aresult)){
                        echo "['".$row["Date"]."', ".$row["Mean"].", ".$row["Mode"].", ".$row["Variance"]."],";
                    }
                ?>


               ]);


    var view = new google.visualization.DataView(data);
        view.setColumns([0, 1, {
        calc: 'stringify',
        sourceColumn: 1,
        type: 'string',
        role: 'annotation'

    }]);


            var options = {
                title: 'Data',
                hAxis : {textStyle : {fontSize: 8}},
                'tooltip' : { trigger: 'none'},
                enableInteractivity: false, 
                width: '100%',
                height: '700',
                chartArea:{
                left:10,
                top: 100,
                width: '100%',
                height: '450',
                },
                pointSize:4,
                vAxis: { textPosition: 'none', gridlines: { count: 10 }, baselineColor: 'gray' }, 
                annotations: { stemColor: 'white', textStyle: { fontSize: 11 } }, 
                legend: { position: 'bottom' }
                     };


               var chart = new google.visualization.LineChart(document.getElementById('curvechart')); 
               chart.draw(data, options); 

            chart.draw(view, options);  

        }

    </script>
</head>
<body>
     <div id="curvechart" style="width: 2500px; height: 600px"></div> 
</body>
</html>

更正echo
语句后，只需将列添加到视图中
var view = new google.visualization.DataView(data);
    view.setColumns([0, 1, {
    calc: 'stringify',
    sourceColumn: 1,
    type: 'string',
    role: 'annotation'
}, 2, 3]);

或者如果你想让所有人都有注解
var view = new google.visualization.DataView(data);
    view.setColumns([0, 1, {
    calc: 'stringify',
    sourceColumn: 1,
    type: 'string',
    role: 'annotation'
}, 2, {
    calc: 'stringify',
    sourceColumn: 2,
    type: 'string',
    role: 'annotation'
}, 3, {
    calc: 'stringify',
    sourceColumn: 3,
    type: 'string',
    role: 'annotation'
}, ]);

我在解释我的问题时做了一个更正。需要向setColumns添加额外的列索引（2，3），在echo语句末尾的注释列也看起来像是右括号]丢失之后。我添加了右括号，并添加了以下注释列，但没有任何更改。它仅为日期和平均值生成图形var data=new google.visualization.DataTable（）；data.addColumn（'number'，'Mode'）；data.addColumn（'number'，'Variance'）；var data=google.visualization.arrayToDataTable（[再次感谢您，WhiteHat。这是第二次，您的帮助。我为此花费了数小时，但无法修复。祝您度过愉快的一天！
var view = new google.visualization.DataView(data);
    view.setColumns([0, 1, {
    calc: 'stringify',
    sourceColumn: 1,
    type: 'string',
    role: 'annotation'
}, 2, {
    calc: 'stringify',
    sourceColumn: 2,
    type: 'string',
    role: 'annotation'
}, 3, {
    calc: 'stringify',
    sourceColumn: 3,
    type: 'string',
    role: 'annotation'
}, ]);