Echarts AJAX данных

Question

Я попытался реализовать диаграмму с типом данных chart и ajax. Когда я показал бы результат вызова в xAxis, ничего не показывая. Это код этой диаграммы

<div id="main" style="width:600px; height:400px;"></div>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('main'));
var dati = $.ajax({
    url: '../../admin/root/chart.php', // provide correct url
    type: 'POST',
    dataType: 'JSON', // <-- since youre expecting JSON
    success: function(chart_values) {
        console.log(chart_values); // take a peek on the values (browser console)
    }
});
// specify chart configuration item and data
option = {
    legend: {},
    tooltip: {},
    dataset: {
        // Provide data.
        source: [             
            ['product', 'Aperti', 'chiusi'],            
            ['Cognome'],        
        ]
    },     // Declare X axis, which is a category axis, mapping    
    // to the first column by default.     
    xAxis : {
        type: 'category',
        data: dati 
    },     // Declare Y axis, which is a value axis.     
    yAxis: {},     // Declare several series, each of them mapped to a     
    // column of the dataset by default.     
    series: [         
        {type: 'bar'},         
        {type: 'bar'},         
        {type: 'bar'}     
    ]
}
// use configuration item and data specified to show chart
myChart.setOption(option);
</script>

И это то, что я называю

$utente = mysqli_query($conne,"SELECT * FROM operatore") or die("Error: 
".mysqli_error($conne));
while ($row=mysqli_fetch_array($utente)) {
    $cognome=$row['cognome'];
    $aperti=mysqli_query($conne,"SELECT * FROM rapportino WHERE 
    id_operatore='$row[matricola]'");
    if ($aperti) {
        $conta_ape=mysqli_num_rows($aperti);
    }
    $chiusi = mysqli_query($conne,"SELECT * FROM compila_rapportino WHERE 
    operatore_chius='$row[matricola]'");
    if ($chiusi) {
        $conta_chi=mysqli_num_rows($chiusi);
    }
    $myArray = array(
        'cognome'=>$cognome,
        'aperti' => $conta_ape,
        'chiusi' => $conta_chi,
    );
    echo json_encode($myArray);
}

При этом данные вызова могут быть повторены в другой момент.

Answer 1

Но из того, что я вижу в вашем текущем сообщении, вы неправильно имеете дело с вызовом Ajax: вы делаете вызов, не передавая свои данные в код, который создает диаграмму. Что вы должны сделать, это поместить эту часть вашего кода:

// specify chart configuration item and data
option = {
    legend: {},
    tooltip: {},
    dataset: {
        // Provide data.
        source: [             
            ['product', 'Aperti', 'chiusi'],            
            ['Cognome'],        
        ]
    },     // Declare X axis, which is a category axis, mapping    
    // to the first column by default.     
    xAxis : {
        type: 'category',
        data: dati 
    },     // Declare Y axis, which is a value axis.     
    yAxis: {},     // Declare several series, each of them mapped to a     
    // column of the dataset by default.     
    series: [         
        {type: 'bar'},         
        {type: 'bar'},         
        {type: 'bar'}     
    ]
}
// use configuration item and data specified to show chart
myChart.setOption(option);

внутри обратного вызова success и используйте полученные данные (chart_values):

var myChart = echarts.init(document.getElementById('main'));
var dati = $.ajax({
    url: '../../admin/root/chart.php', // provide correct url
    type: 'POST',
    dataType: 'JSON',
    success: function(chart_values) {
        console.log(chart_values); // take a peek on the values (browser console)

        //# put that code here and use chart_values!
    }
});

Таким образом, как только вы получите данные, вы сможете нарисовать диаграмму.