Pie CHart sagt immer, meine erste Spalte ist keine Zeichenfolge (Bearbeiten)

Question

Lassen Sie mich einen kurzen Hintergrund geben: Der Prozess geht so: DB-Methode gibt einen Wert zu einem Seitenskript -> generiert JSON -> an Google-Diagramm senden js-Datei. Dies erzeugt ein Kreisdiagrammdiagramm, aber es sagt immer, dass die erste Spalte eine Zeichenkette sein sollte ... welche es ist! Die Codes:

Die PHP-Klasse Methode:

function select_heuristic_piechart1(&$conn){ 

     $query = ("SELECT hl_name AS name, count(hl_element2) As counted FROM `heuristic_listings` group by hl_element1"); 
     $statement = $conn->prepare($query); 
     $statement->execute(); 
     $exist = $statement->fetchAll(PDO::FETCH_ASSOC); 

     $rows = array(); 
     $table = array(); 

     $table['cols'] = array(

     // Labels for your chart, these represent the column titles. 

      array('label' => 'first_header', 'type' => 'string'), 
      array('label' => 'second_header', 'type' => 'number') 

     ); 

     foreach($exist as $r) { 

      $temp = array(); 

      // the following line will be used to slice the Pie chart 

      $temp[] = array('v' => (string) $r['name']); 

      // Values of each slice 

     $temp[] = array('v' => (int) $r['counted']); 
     $rows[] = array('c' => $temp); 
     } 

     $table['rows'] = $rows; 


     return $json = Json_encode($table,true); 

Der Empfänger und Sender

include './database.php'; 


$connection = new database(); 
$conn = $connection->connect_db(); 
$fetchedResult = $connection->select_heuristic_piechart1($conn); 
header('Content-Type: application/json'); 
$json = json_encode($fetchedResult,true); 

echo $json; 

Und der Ajax:

$.ajax({ 
    url: "./db/receiver_and_transmitter.php", 
    data: 'GET', 
    dataType: 'json', 
    success: function(data){ 
     console.log('Yas'); 
     console.log(data); 
     var data = new google.visualization.DataTable(data); 

    }, 
    error:function(data){ 

     console.log('fail'); 
     console.log(data); 
    } 
}); 

Ich habe keine Ahnung, was wen't falsch und was zu ändern. Kann mir jemand in die richtige Richtung zeigen?

---

Die JSON, die von der $ .ajax empfangen wurde:

{"cols":[{"label":"first_header","type":"string"}, 
{"label":"second_header","type":"number"}],"rows":[{"c":[{"v":"cwood1r"}, 
{"v":5}]},{"c":[{"v":"sward2h"},{"v":2}]},{"c":[{"v":"etorres19"},{"v":2}]}, 
{"c":[{"v":"mfranklinr"},{"v":3}]},{"c":[{"v":"mspencerd"},{"v":21}]},{"c": 
[{"v":"jknight1y"},{"v":5}]},{"c":[{"v":"hhoward3"},{"v":4}]},{"c": 
[{"v":"pross6"},{"v":8}]},{"c":[{"v":"swagner7"},{"v":23}]},{"c": 
[{"v":"ajohnston1a"},{"v":8}]},{"c":[{"v":"dalexander1q"},{"v":2}]},{"c": 
[{"v":"rmendoza1u"},{"v":2}]},{"c":[{"v":"mmurphy1f"},{"v":5}]},{"c": 
[{"v":"rthomasp"},{"v":8}]},{"c":[{"v":"wsullivan5q"},{"v":1}]},{"c": 
[{"v":"bperkins3f"},{"v":3}]},{"c":[{"v":"csimpson1j"},{"v":4}]},{"c": 
[{"v":"mortiz2e"},{"v":10}]},{"c":[{"v":"sriley1h"},{"v":2}]},{"c": 
[{"v":"tbryantf"},{"v":10}]},{"c":[{"v":"esimmons15"},{"v":5}]},{"c": 
[{"v":"psullivan35"},{"v":2}]},{"c":[{"v":"jwatson9"},{"v":7}]},{"c": 
[{"v":"jcampbell1v"},{"v":2}]},{"c":[{"v":"rford14"},{"v":5}]},{"c": 
[{"v":"jnichols4m"},{"v":1}]},{"c":[{"v":"agreenm"},{"v":1}]},{"c": 
[{"v":"rmorris1"},{"v":4}]},{"c":[{"v":"pboyd16"},{"v":1}]},{"c": 
[{"v":"jdixon2"},{"v":12}]},{"c":[{"v":"kbrownv"},{"v":8}]},{"c": 
[{"v":"slarson2l"},{"v":2}]},{"c":[{"v":"lrileyn"},{"v":9}]},{"c": 
[{"v":"mholmes1t"},{"v":5}]},{"c":[{"v":"phill4"},{"v":5}]},{"c": 
[{"v":"pwalkerh"},{"v":2}]},{"c":[{"v":"thawkins1g"},{"v":6}]},{"c": 
[{"v":"crussell0"},{"v":27}]},{"c":[{"v":"cweaver3s"},{"v":2}]},{"c": 
[{"v":"fgonzalesb"},{"v":8}]},{"c":[{"v":"elopez10"},{"v":3}]},{"c": 
[{"v":"pnichols4f"},{"v":1}]},{"c":[{"v":"swallace1i"},{"v":4}]}]} 

Answer 1

die JSON geschrieben funktioniert gut in einem PieChart finden folgende Arbeits Schnipsel.

Wenn dies vom success Callback kam, dann sollte es kein Problem geben.

Welche Google-Diagrammbibliothek verwenden Sie?
loader.js - oder - jsapi

auch, wo die load Anweisung und welche Version verwenden Sie? `In der Ajax-Teil;

google.charts.load('current', { 
 
    callback: function() { 
 
    var jsonData = '{"cols":[{"label":"first_header","type":"string"}, \ 
 
     {"label":"second_header","type":"number"}],"rows":[{"c":[{"v":"cwood1r"}, \ 
 
     {"v":5}]},{"c":[{"v":"sward2h"},{"v":2}]},{"c":[{"v":"etorres19"},{"v":2}]}, \ 
 
     {"c":[{"v":"mfranklinr"},{"v":3}]},{"c":[{"v":"mspencerd"},{"v":21}]},{"c": \ 
 
     [{"v":"jknight1y"},{"v":5}]},{"c":[{"v":"hhoward3"},{"v":4}]},{"c": \ 
 
     [{"v":"pross6"},{"v":8}]},{"c":[{"v":"swagner7"},{"v":23}]},{"c": \ 
 
     [{"v":"ajohnston1a"},{"v":8}]},{"c":[{"v":"dalexander1q"},{"v":2}]},{"c": \ 
 
     [{"v":"rmendoza1u"},{"v":2}]},{"c":[{"v":"mmurphy1f"},{"v":5}]},{"c": \ 
 
     [{"v":"rthomasp"},{"v":8}]},{"c":[{"v":"wsullivan5q"},{"v":1}]},{"c": \ 
 
     [{"v":"bperkins3f"},{"v":3}]},{"c":[{"v":"csimpson1j"},{"v":4}]},{"c": \ 
 
     [{"v":"mortiz2e"},{"v":10}]},{"c":[{"v":"sriley1h"},{"v":2}]},{"c": \ 
 
     [{"v":"tbryantf"},{"v":10}]},{"c":[{"v":"esimmons15"},{"v":5}]},{"c": \ 
 
     [{"v":"psullivan35"},{"v":2}]},{"c":[{"v":"jwatson9"},{"v":7}]},{"c": \ 
 
     [{"v":"jcampbell1v"},{"v":2}]},{"c":[{"v":"rford14"},{"v":5}]},{"c": \ 
 
     [{"v":"jnichols4m"},{"v":1}]},{"c":[{"v":"agreenm"},{"v":1}]},{"c": \ 
 
     [{"v":"rmorris1"},{"v":4}]},{"c":[{"v":"pboyd16"},{"v":1}]},{"c": \ 
 
     [{"v":"jdixon2"},{"v":12}]},{"c":[{"v":"kbrownv"},{"v":8}]},{"c": \ 
 
     [{"v":"slarson2l"},{"v":2}]},{"c":[{"v":"lrileyn"},{"v":9}]},{"c": \ 
 
     [{"v":"mholmes1t"},{"v":5}]},{"c":[{"v":"phill4"},{"v":5}]},{"c": \ 
 
     [{"v":"pwalkerh"},{"v":2}]},{"c":[{"v":"thawkins1g"},{"v":6}]},{"c": \ 
 
     [{"v":"crussell0"},{"v":27}]},{"c":[{"v":"cweaver3s"},{"v":2}]},{"c": \ 
 
     [{"v":"fgonzalesb"},{"v":8}]},{"c":[{"v":"elopez10"},{"v":3}]},{"c": \ 
 
     [{"v":"pnichols4f"},{"v":1}]},{"c":[{"v":"swallace1i"},{"v":4}]}]}'; 
 

 
    var data = new google.visualization.DataTable(jsonData); 
 

 
    var chart = new google.visualization.PieChart(document.getElementById('chart_div')); 
 
    chart.draw(data, { 
 
     height: 300, 
 
     theme: 'maximized', 
 
     width: 300 
 
    }); 
 
    }, 
 
    packages: ['corechart'] 
 
});

<script src="https://www.gstatic.com/charts/loader.js"></script> 
 
<div id="chart_div"></div>