一個或多個參與者未能得出（），無效的列標籤

我有一個看起來像這樣，當我試圖插入數字範圍過濾器對我的餅圖一個或多個參與者未能得出（），無效的列標籤

一個或多個參與者未能得出一個錯誤（）無效列標籤：百分比

How it look likes and there's no error message in the console

我試圖使它看起來完全一樣，他們在https://developers.google.com/chart/interactive/docs/gallery/controls與數據的唯一區別提供的例子。示例中使用的數據是硬編碼的，而我使用的數據直接來自使用PHP的MySQL。

這是我的PHP代碼。

<?php 
$con=mysqli_connect("localhost","root","password") or die("Failed to connect with database"); 
mysqli_select_db($con, "tutor"); 

$sql="SELECT * 
FROM googlechart"; 

$result = mysqli_query($con,$sql) or die(mysqli_error($con)); 

$rows = array(); 
$flag = true; 

$table = array(); 
$table['cols'] = array(
    array('label' => 'Topics', 'type' => 'string'), 
    array('label' => 'Percentage', 'type' => 'number') 

); 

$rows = array(); 
while($r = mysqli_fetch_assoc($result)) { 
    $temp = array(); 
    $temp[] = array('v' => (string) $r['weekly_task']); 
    $temp[] = array('v' => (int) $r['percentage']); 
    $rows[] = array('c' => $temp); 
} 

$table['rows'] = $rows; 
$jsonTable = json_encode($table); 
?> 

<head> 
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 

    <script type="text/javascript"> 

     google.charts.load('current', {'packages':['corechart', 'controls']}); 

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

      var data = new google.visualization.DataTable(<?=$jsonTable?>); 

      var dashboard = new google.visualization.Dashboard(
       document.getElementById('dashboard_div')); 

      var donutRangeSlider = new google.visualization.ControlWrapper({ 
       'controlType': 'NumberRangeFilter', 
       'containerId': 'filter_div', 
       'options': { 
        'filterColumnLabel': 'percentage' 
       } 
      }); 

      var pieChart = new google.visualization.ChartWrapper({ 
       'chartType': 'PieChart', 
       'containerId': 'chart_div', 
       'options': { 
        'width': 300, 
        'height': 300, 
        'pieSliceText': 'value', 
        'legend': 'right' 
       } 
      }); 
      dashboard.bind(donutRangeSlider, pieChart); 
      dashboard.draw(data); 
     } 
    </script> 
</head> 

<body> 
<div id="dashboard_div"> 
    <div id="filter_div"></div> 
    <div id="chart_div"></div> 
</div> 
</body>

請指教。先謝謝你。

來源

2017-08-08 Kin Leung

問題在於donutRangeSlider的filterColumnLabel。

var donutRangeSlider = new google.visualization.ControlWrapper({ 
      'controlType': 'NumberRangeFilter', 
      'containerId': 'filter_div', 
      'options': { 
       'filterColumnLabel': 'percentage' 
      } 
     });

而是將其命名爲「百分比」，應該是「百分比」作爲跟隨在PHP代碼中的列標籤。

$table['cols'] = array(
array('label' => 'Topics', 'type' => 'string'), 
array('label' => 'Percentage', 'type' => 'number') 
);

解決方案：

var donutRangeSlider = new google.visualization.ControlWrapper({ 
      'controlType': 'NumberRangeFilter', 
      'containerId': 'filter_div', 
      'options': { 
       'filterColumnLabel': 'Percentage' 
      } 
     });

來源

2017-08-08 05:13:37

一個或多個參與者未能得出（），無效的列標籤

回答

相關問題