echarts生成折线图

Echarts 是百度开源的一个数据可视化库，它可以用来制作各种类型的图表，包括折线图、柱状图、饼图等等。下面是使用 Echarts 生成折线图的步骤：

1. 引入 Echarts 库

在 HTML 文件中引入 Echarts 库：

<script src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js"></script>

2. 准备数据

定义一个数组来存储数据，例如：

var data = [10, 20, 30, 40, 50];

3. 创建图表

创建一个 div 元素来作为图表的容器，例如：

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

然后在 JavaScript 中创建一个 Echarts 实例，并将数据和配置项传递给它：

var chart = echarts.init(document.getElementById('chart'));

var option = {
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: data,
        type: 'line'
    }]
};

chart.setOption(option);

这里的 option 对象包含了图表的配置项，包括 x 轴和 y 轴的类型、数据、线条样式等等。最后调用 setOption 方法将配置项应用到图表中。

4. 显示图表

调用 chart 的方法来显示图表：

chart.render();

这样就可以在页面上显示一个简单的折线图了。