echarts 柱状图ajax动态加载数据

要实现 echarts 柱状图的 ajax 动态加载数据，你需要先准备好后端服务接口，返回 JSON 格式的数据。然后在前端代码中使用 AJAX 技术请求这个接口，得到数据后再使用 Echarts 绘制柱状图。

下面是一个简单的示例代码：

HTML 代码：

<div id="chart" style="height: 400px;"></div>

JavaScript 代码：

// 初始化 Echarts 实例
var chart = echarts.init(document.getElementById('chart'));

// 定义请求数据的函数
function requestData() {
  $.ajax({
    url: 'https://example.com/data', // 后端服务接口地址
    type: 'GET',
    dataType: 'json',
    success: function (data) {
      // 渲染图表
      chart.setOption({
        xAxis: {
          type: 'category',
          data: data.categories // x 轴数据
        },
        yAxis: {
          type: 'value'
        },
        series: [{
          data: data.values, // y 轴数据
          type: 'bar'
        }]
      });
    }
  });
}

// 页面加载完成后先请求一次数据
requestData();

// 每隔 5 秒请求一次数据
setInterval(requestData, 5000);

在这个示例代码中，我们使用 jQuery 的 AJAX 方法请求后端服务接口，获取 JSON 格式的数据。然后在 success 回调函数中，使用 Echarts 的 setOption 方法渲染图表。最后，我们使用 setInterval 方法每隔 5 秒请求一次数据，实现动态更新图表的效果。