为什么json_encoded数据不显示

Question

I have add chartJS and that works just fine, the problem i have when im trying to add my json_encoded php array in to the data field in chartJS. The problem i have is that the chart wont add my data in to the bars. See the picture enter image description here

This is how my json_encoded array looks like when im using print_r to output the data

[{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"6"},{"todoCoin":"5"},{"todoCoin":"3"},{"todoCoin":"1"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"4"},{"todoCoin":"5"},{"todoCoin":"9"},{"todoCoin":"10"},{"todoCoin":"11"},{"todoCoin":"6"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"2"},{"todoCoin":"6"},{"todoCoin":"8"},{"todoCoin":"10"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"8"},{"todoCoin":"1"},{"todoCoin":"1"}]

If i remove the json_encode my array looks like this

Array ( [0] => Array ( [todoCoin] => 1 ) [1] => Array ( [todoCoin] => 1 ) [2] => Array ( [todoCoin] => 1 ) [3] => Array ( [todoCoin] => 1 ) [4] => Array ( [todoCoin] => 1 ) [5] => Array ( [todoCoin] => 6 ) [6] => Array ( [todoCoin] => 5 ) [7] => Array ( [todoCoin] => 3 ) [8] => Array ( [todoCoin] => 1 ) [9] => Array ( [todoCoin] => 2 ) [10] => Array ( [todoCoin] => 4 ) [11] => Array ( [todoCoin] => 4 ) [12] => Array ( [todoCoin] => 5 ) [13] => Array ( [todoCoin] => 9 ) [14] => Array ( [todoCoin] => 10 ) [15] => Array ( [todoCoin] => 11 ) [16] => Array ( [todoCoin] => 6 ) [17] => Array ( [todoCoin] => 4 ) [18] => Array ( [todoCoin] => 3 ) [19] => Array ( [todoCoin] => 2 ) [20] => Array ( [todoCoin] => 6 ) [21] => Array ( [todoCoin] => 8 ) [22] => Array ( [todoCoin] => 10 ) [23] => Array ( [todoCoin] => 2 ) [24] => Array ( [todoCoin] => 4 ) [25] => Array ( [todoCoin] => 3 ) [26] => Array ( [todoCoin] => 8 ) [27] => Array ( [todoCoin] => 1 ) [28] => Array ( [todoCoin] => 1 ) ) 1

Here is the only html i have

<div class="container">
    <canvas id="myChart"></canvas>
</div>

and then the javascript

<script>
    var myChart = document.getElementById('myChart').getContext('2d');

    // Global Options
    Chart.defaults.global.defaultFontFamily = "Lato";
    Chart.defaults.global.defaultFontsize = 18;
    Chart.defaults.global.defaultFontColor = "#777";
    var test = 80;
    var massPopChart = new Chart(myChart, {
        type:'bar', // bar, horizontalBar, pie, doughnut, radar, polarArea
        data: {
            labels:['Färdiga todo', 'Tid nedlagt', 'Användare'],
            datasets: [{
                label:'Todo Score', 
                data:[
                    <?php echo json_encode($data);?>,
                    <?php echo json_encode($data);?>,
                    <?php echo json_encode($data);?>
                ], 
                backgroundColor:[
                    'rgba(128,128,0)',
                    'rgba(255,0,0)',
                    'rgba(0,0,255)'
                ],
                borderWidth: 1,
                borderColor: '#777',
                hoverBorderWidth: 3,
                hoverBorderColor: '#000'
            }]
        },
        options: {
            title: {
                display: true,
                text: 'Överblick på din todoScore',
                fontSize: 25,

            },
            legend:{
                position: "right"
            }
        }   
    });
</script>

An example snippet wihtout the php

 var myChart = document.getElementById('myChart').getContext('2d'); // Global Options Chart.defaults.global.defaultFontFamily = "Lato"; Chart.defaults.global.defaultFontsize = 18; Chart.defaults.global.defaultFontColor = "#777"; var test = 80; var massPopChart = new Chart(myChart, { type: 'bar', // bar, horizontalBar, pie, doughnut, radar, polarArea data: { labels: ['Färdiga todo', 'Tid nedlagt', 'Användare'], datasets: [{ label: 'Todo Score', data: [ [{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"6"},{"todoCoin":"5"},{"todoCoin":"3"},{"todoCoin":"1"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"4"},{"todoCoin":"5"},{"todoCoin":"9"},{"todoCoin":"10"},{"todoCoin":"11"},{"todoCoin":"6"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"2"},{"todoCoin":"6"},{"todoCoin":"8"},{"todoCoin":"10"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"8"},{"todoCoin":"1"},{"todoCoin":"1"}], [{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"6"},{"todoCoin":"5"},{"todoCoin":"3"},{"todoCoin":"1"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"4"},{"todoCoin":"5"},{"todoCoin":"9"},{"todoCoin":"10"},{"todoCoin":"11"},{"todoCoin":"6"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"2"},{"todoCoin":"6"},{"todoCoin":"8"},{"todoCoin":"10"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"8"},{"todoCoin":"1"},{"todoCoin":"1"}], [{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"1"},{"todoCoin":"6"},{"todoCoin":"5"},{"todoCoin":"3"},{"todoCoin":"1"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"4"},{"todoCoin":"5"},{"todoCoin":"9"},{"todoCoin":"10"},{"todoCoin":"11"},{"todoCoin":"6"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"2"},{"todoCoin":"6"},{"todoCoin":"8"},{"todoCoin":"10"},{"todoCoin":"2"},{"todoCoin":"4"},{"todoCoin":"3"},{"todoCoin":"8"},{"todoCoin":"1"},{"todoCoin":"1"}] ], backgroundColor: [ 'rgba(128,128,0)', 'rgba(255,0,0)', 'rgba(0,0,255)' ], borderWidth: 1, borderColor: '#777', hoverBorderWidth: 3, hoverBorderColor: '#000' }] }, options: { title: { display: true, text: 'Överblick på din todoScore', fontSize: 25, }, legend: { position: "right" } } });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.bundle.js"></script> <div class="container"> <canvas id="myChart"></canvas> </div>

Answer 1

To output data from your json array, you should use json_decode . Assuming $data is what you declared your json array with:

<?php 
  $decoded_data = json_decode($data);
  foreach ($decoded_data->{'todoCoin'} as $todoCoin) {
    echo $todoCoin;
  }
?>

Try that in your data:[]

edit

I see where I misread that it is a multidimensional array you encoded. This is also why you are seeing array to string conversion error when trying to use echo - you have multiple arrays in an array itself. Try this in your data:[] property:

<?php 
  $decoded = json_decode($data); // decode your json 2d array
  $decoded_array = array(); // create new 1D array
  # break down the first array
  foreach ($decoded as $todoCoins) {
    # break down the second array
    foreach ($todoCoins as $todoCoin) {
      # append each value, ignoring the 'todoCoin' key, to the new 1d array
      array_push($decoded_array, $todoCoin);
    }
  }
  echo implode(", ", $decoded_array); // outputs 1,1,1,1,1,6,5,3,1, etc...
?>