echarts ajax动态加载数据

Echarts 是一个基于 JavaScript 的可视化图表库，它支持各种图表类型，包括折线图、柱状图、散点图等等。Echarts 的数据可以通过 ajax 动态加载，以下是一个简单的示例：

1. HTML 页面中引入 echarts 和 jQuery 库

<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

2. 创建一个 div 容器来显示图表

<div id="mychart" style="width: 600px;height:400px;"></div>

3. 使用 jQuery 发送 ajax 请求获取数据

$.ajax({
  type: 'GET',
  url: 'data.json',
  dataType: 'json',
  success: function (data) {
    // 数据加载成功后，调用 Echarts 的绘图函数
    var chart = echarts.init(document.getElementById('mychart'));
    chart.setOption({
      // 设置图表参数
      xAxis: {
        type: 'category',
        data: data.categories
      },
      yAxis: {
        type: 'value'
      },
      series: [{
        data: data.values,
        type: 'line'
      }]
    });
  }
});

4. 在服务器上准备一个数据文件 data.json，该文件包含了图表所需的数据

{
  "categories": ["一月", "二月", "三月", "四月", "五月", "六月"],
  "values": [12, 8, 10, 15, 20, 18]
}

以上就是一个简单的 echarts ajax 动态加载数据的示例，你可以根据自己的需求修改代码。