How to get backend data in Echarts?

When using ECharts to retrieve backend data, typically data is first fetched from the backend using Ajax requests and then passed to ECharts for rendering. Below is a basic example code:

// 使用Ajax从后端获取数据
$.ajax({
    url: 'your_backend_url',
    type: 'GET',
    dataType: 'json',
    success: function (data) {
        // 数据获取成功后，进行ECharts的初始化和渲染
        var myChart = echarts.init(document.getElementById('main'));
        
        var option = {
            xAxis: {
                type: 'category',
                data: data.xAxisData
            },
            yAxis: {
                type: 'value'
            },
            series: [{
                data: data.seriesData,
                type: 'bar'
            }]
        };

        myChart.setOption(option);
    },
    error: function (error) {
        console.log("Error: ", error);
    }
});

In the example above, we retrieve data from the backend through an Ajax request. After successfully obtaining the data, we initialize the chart using the echarts.init() method from ECharts, then set the data and configurations, and finally render it by calling the setOption() method. In practical applications, depending on the data structure returned from the backend and the type of chart to be displayed, we can adjust the configurations and data settings accordingly.