echart一个div里绘制多个折线图，各占百分之20区域

在ECharts中，在一个div中同时绘制多个折线图并让它们占据各自20%的区域，你可以通过以下几个步骤实现：

1. 首先，创建一个包含多个`echarts`实例的数组，每个实例对应一个单独的折线图。

let charts = [];
for (let i = 0; i <= 5; i++) { // 假设你想显示5个折线图，每个占用20%，总和100%
    let chart = echarts.init(document.getElementById(`chart-${i}`)); // 图表ID需要自定义
    charts.push(chart);
}

2. 对于每个图表，配置各自的数据和样式，并设置宽度为20%。假设容器的总宽度为400px（实际可根据需求调整），每个图表的宽度就是80px。

charts.forEach((chart, index) => {
    let option = {
        width: '80px', // 每个折线图宽度
        height: '400px',
        series: [
            {
                name: `Series ${index + 1}`,
                type: 'line',
                data: ... // 这里填写你要展示的数据
            }
        ]
    };
    
    chart.setOption(option); // 设置选项
});

3. 确保容器的宽度足够容纳所有折线图，并将它们水平排列，可以使用CSS布局如Flexbox或Grid来实现。

.container {
    display: flex;
    justify-content: space-between; /* 或者使用grid-gap */
    width: 400px;
}

现在，你在一个div容器中应该能看到五个占据各自20%区域的折线图了。