echarts柱状图ajax
时间: 2023-07-22 13:02:41 浏览: 94
echarts柱状图
你可以使用 ECharts 来绘制一个柱状图,并通过 AJAX 请求获取数据。以下是一个简单的示例:
首先,确保你已经引入了 ECharts 的库文件。然后,在 HTML 中创建一个包含柱状图的容器元素,如:
```html
<div id="chartContainer" style="width: 600px; height: 400px;"></div>
```
接下来,在 JavaScript 中编写代码来创建柱状图并发送 AJAX 请求获取数据,然后将数据传递给图表。示例代码如下:
```javascript
// 创建柱状图
var myChart = echarts.init(document.getElementById('chartContainer'));
// 发送 AJAX 请求获取数据
var xhr = new XMLHttpRequest();
xhr.open('GET', 'your_data_url', true);
xhr.onload = function() {
if (xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
// 处理数据并设置到图表中
var option = {
xAxis: {
type: 'category',
data: data.categories
},
yAxis: {
阅读全文