AJAX 是一种用于创建交互式网页应用程序的技术，它可以在不刷新整个页面的情况下，将数据从服务器异步加载到网页中。同时，ECharts 是一款功能强大的图表库，它具有丰富的图表样式和灵活的配置项，使得数据可视化变得更加简单。在使用 AJAX 和 ECharts 的结合之后，我们可以实现动态刷新数据，并实时展示到图表中，从而提升用户体验和数据展示效果。

假设我们正在开发一个实时展示气温变化的应用程序。我们希望通过网页上的一个图表，展示某个城市的实时气温数据。为了实现这个功能，我们可以使用 AJAX 来获取服务器上的气温数据，并使用 ECharts 来动态刷新图表展示。

<script type="text/javascript">
// 使用 AJAX 请求服务器上的气温数据
function getTemperatureData() {
$.ajax({
url: "api/temperature",  // 服务器接口地址
type: "GET",
dataType: "json",
success: function(data) {
// 数据获取成功后，更新图表展示
updateChart(data);
},
error: function() {
console.log("Failed to get temperature data.");
}
});
}
// 使用 ECharts 更新图表展示
function updateChart(data) {
var chart = echarts.init(document.getElementById('chart'));
var option = {
// 配置图表样式和数据
xAxis: {
type: 'category',
data: data.time
},
yAxis: {
type: 'value'
},
series: [{
data: data.temperature,
type: 'line'
}]
};
chart.setOption(option);
}
// 定时刷新图表数据
setInterval(function() {
getTemperatureData();
}, 5000);
</script>

在上述代码中，我们定义了一个函数getTemperatureData，用于发送 AJAX 请求并获取服务器上的气温数据。当 AJAX 请求成功返回数据后，我们再调用函数updateChart来更新图表展示。

函数updateChart中，我们首先通过echarts.init方法初始化一个图表，将其绑定到 HTML 页面上的一个 DOM 元素上。然后，我们配置了图表的样式和数据，并调用setOption方法将配置应用到图表中。

最后，我们使用setInterval方法来定时刷新图表数据。在每隔 5 秒钟的间隔内，我们会调用一次getTemperatureData方法，从服务器获取最新的气温数据，并将其更新到图表中。

通过以上代码的实现，我们可以在网页上实时展示气温数据的变化情况。每隔 5 秒钟，图表上的数据会自动刷新一次，用户可以通过图表直观地了解到气温的变化趋势。