谷歌图表JSON和数组的问题 [英] Google Charts JSON and Array Problems

问题描述

有传递JSON到arrayToDataTable麻烦。我从一个PHP While循环......

创建JSON

我试图取代与DataArray中硬codeD JSON数据是从DB ...

动态更新

 ＆LT;脚本类型=文/ JavaScript的 src=\"https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['bar']}]}\"></script>而（$行= oci_fetch_array（$ QUERY1，OCI_ASSOC + OCI_RETURN_NULLS））{$ I ++;
$ total_obs + = $行['CN'];}$ dataArray中=阵列（$ I，$ total_obs）;
json_en code（$ dataArray中）;
＆LT;脚本＆GT;  google.setOnLoadCallback（drawChart）;  功能drawChart（）{
     VAR数据= google.visualization.arrayToDataTable（[
      ['周'，'彩民']，
      ['1'，4]
      ['2'，5]，
      ['3'，5]，
      ['4'，8]，
      ['5'，11]，
      ['6'，13]，
      ['7'，13]，
      ['8'，14]，
      ['9'，15]，
      ['10'，0]，
      ['11'，0]，
      ['12'，0]，
      ['13'，0]，
      ['14'，0]，
      ['15'，0]，
      ['16'，0]，
      ['17'，0]，
      ['18'，0]，
      ['19'，0]，
      ['20'，0]，
      ['21'，0]，
      ['22'，0]，
      ['23'，0]，
      ['24'，0]，
      ['25'，0]，
      ['26'，0]，
      ['27'，0]，
      ['28'，0]，
      ['29'，0]，
      ['30'，0]，
      ['31'，0]，
      ['32'，0]，
      ['33'，0]，
      ['34'，0]，
      ['35'，0]，
      ['36'，0]，
      ['37'，0]，
      ['38'，0]，
      ['39'，0]，
      ['40'，0]，
      ['41'，0]，
      ['42'，0]，
      ['43'，0]，
      ['44'，0]，
      ['45'，0]，
      ['46'，0]，
      ['47'，0]，
      ['48'，0]，
      ['49'，0]，
      ['50'，0]，
      ['51'，0]，
      ['52'，0]，
      ['53'，0]
    ]）;    VAR的选择= {
      图：{
        标题：在会计年度总计2016年 - 累积总计中，
        字幕：2015年10月1日至2016年9月30日，
      }，
      趋势线：{
0：{
  类型：线性，
  颜色：绿色，
  的lineWidth：3，
  不透明度：0.3，
  showR2：真实，
  visibleInLegend：真
}
  }，
          酒吧：垂直，//所需的材料条形图。
          hAxis：{格式：十进制}，
          高度：400，
          颜色：['＃d95f02']，
         //趋势线：{0：{}} //画出数据系列0的趋势线。
        };    VAR图=新google.charts.Bar（的document.getElementById（'chart_div'））;    chart.draw（数据，google.charts.Bar.convertOptions（选项））;
  }
 

解决方案

谷歌可视化需要与X，Y值连续二维数组。根据假设 $行['CN'] 保存的值，你应该构建PHP数组是这样的：

$ total_obs =阵列（）;
$ total_obs [] =阵列（'周'，'彩民'）;
$ I = 0;
而（$行= oci_fetch_array（$ QUERY1，OCI_ASSOC + OCI_RETURN_NULLS））{
   $ I ++;
   $ total_obs [] =阵列（$ I，$行['CN']）;
}


和回声它在＆LT;脚本＆GT; 是这样的：

VAR数据= google.visualization.arrayToDataTable（LT ;?回声json_en code（$ total_obs）;？＆GT ）;


这将导致（例如）：

VAR数据= google.visualization.arrayToDataTable（[周，汇总]，[1,4] ，[2,5]，..]）;


这正是你和谷歌可视化需要什么..：）

---

更新数组来保存52周，如果所有的周未为present，由，而循环结束后这样做：

 为（$ I =计数（$ total_obs）; $ I＆LT; 53; $ I ++）{
    $ total_obs [] =阵列（$ I，0）;
}
 

Having trouble passing the JSON into the arrayToDataTable. I am creating the JSON from with a PHP While Loop...

I am trying to replace the hard coded JSON data with the DataArray which is updated dynamically from the DB...

<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1.1','packages':['bar']}]}"></script>



while ($row = oci_fetch_array($query1, OCI_ASSOC+OCI_RETURN_NULLS)) {

$i++;
$total_obs += $row['CN'];

}

$dataArray = array($i,$total_obs);   
json_encode($dataArray);


<script>

  google.setOnLoadCallback(drawChart);

  function drawChart() {


     var data = google.visualization.arrayToDataTable([
      ['Week', 'Totals'],
      ['1', 4],
      ['2', 5],
      ['3', 5],
      ['4', 8],
      ['5', 11],
      ['6', 13],
      ['7', 13],
      ['8', 14],
      ['9', 15],
      ['10', 0],
      ['11', 0],
      ['12', 0],
      ['13', 0],
      ['14', 0],
      ['15', 0],
      ['16', 0],
      ['17', 0],
      ['18', 0],
      ['19', 0],
      ['20', 0],
      ['21', 0],
      ['22', 0],
      ['23', 0],
      ['24', 0],
      ['25', 0],
      ['26', 0],
      ['27', 0],
      ['28', 0],
      ['29', 0],
      ['30', 0],
      ['31', 0],
      ['32', 0],
      ['33', 0],
      ['34', 0],
      ['35', 0],
      ['36', 0],
      ['37', 0],
      ['38', 0],
      ['39', 0],
      ['40', 0],
      ['41', 0],
      ['42', 0],
      ['43', 0],
      ['44', 0],
      ['45', 0],
      ['46', 0],
      ['47', 0],
      ['48', 0],
      ['49', 0],
      ['50', 0],
      ['51', 0],
      ['52', 0],
      ['53', 0]             
    ]);

    var options = {
      chart: {
        title: 'Totals in Fiscal Year 2016 - Cumulative Total',
        subtitle: 'Oct 1, 2015 to Sep 30, 2016',
      },
      trendlines: {
0: {
  type: 'linear',
  color: 'green',
  lineWidth: 3,
  opacity: 0.3,
  showR2: true,
  visibleInLegend: true
}
  },    
          bars: 'vertical', // Required for Material Bar Charts.
          hAxis: {format: 'decimal'},
          height: 400,
          colors: ['#d95f02'],
         // trendlines: { 0: {} }    // Draw a trendline for data series 0.
        };

    var chart = new google.charts.Bar(document.getElementById('chart_div'));

    chart.draw(data, google.charts.Bar.convertOptions(options));




  }

解决方案

Google visualization needs a continuous 2d array with x,y values. Under the assumption that $row['CN'] hold the values, you should construct the PHP array like this :

$total_obs = array();
$total_obs[] = array('Week', 'Totals');
$i=0;
while ($row = oci_fetch_array($query1, OCI_ASSOC+OCI_RETURN_NULLS)) {
   $i++;
   $total_obs[] = array($i, $row['CN']);
}

And echo it out in the <script> like this :

var data = google.visualization.arrayToDataTable(<? echo json_encode($total_obs); ?>);

This will result in (example) :

var data = google.visualization.arrayToDataTable([["Week","Totals"],[1,4],[2,5],..]);

Which is exactly what both you and google visualization wants ..:)

---

Update the array to hold 52 weeks, if all weeks not is present, by doing this after the while loop :

for ($i=count($total_obs);$i<53;$i++) {
    $total_obs[] = array($i, 0);
}

这篇关于谷歌图表JSON和数组的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！