PHP Json Array Daten mit Chartist

Question

Ich versuche, eine Charts Linie Grafik aus JSON-Array zu erstellen.

echo json_encode($json_data); 

Rückkehr

[{"labels": [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27], 
    "series":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,17,0,2,0,0]}] 

meine Jquery

var url = "/appx/array.php" 
    var resp = jQuery.parseJSON(
    jQuery.ajax({ 
     url: url, 
     async: false, 
     dataType: 'json' 
    }).responseText 
); 


var data = resp; // here i dont know how to do 

/*var data = labels: ['1', '2', '3','4'], series: [[1, 3, 7, 12]] original data*/ 

new Chartist.Line("#teamCompletedWidget .ct-chart", data,options); 

Serie hat Array von Array sein

series[[1,2,3]] 

meine PHP-Code

for($i=1; $i<=date("d"); $i++){ 

    $json_array['labels'][] = $i; 

    $json_array['series'][] = intval($clicks[$i]); 

} 
echo json_encode($json_data); 

kehrt

{"labels":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28], 
    "series":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,57,5,17,0,2,0,0,0]} 

Answer 1

die Json Antwort lesen und es in das Format neu zusammenstellen, die Chartisten erwartet:

//JSON returned: 

var resp ='{"labels": [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28],"series":[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,57,5,17,0,2,0,0,0]}'; 

var JSONObject = JSON.parse(resp); 
console.log(JSONObject.labels); 
//[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28] 
console.log(JSONObject.series); 
//[0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 57, 5, 17, 0, 2, 0, 0, 0] 

// In your particular case, your response becomes the JSONObject 
// So you would use resp.labels and resp.series 

var data = {"labels":JSONObject.labels, "series":[JSONObject.series]}; 

// var data = {"labels":[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27],"series":[[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,17,0,2,0,0]]}; 


new Chartist.Line('#chart1', data); 

Ergebnis:

Codepen: Chartist JSON data format