echart图标引入后不随dom容器自适应

对于这个问题，我可以提供一些解决方案。首先，可以尝试使用resize事件来监听容器大小的变化，然后手动调用echarts的resize方法来重新渲染图表。另外，也可以在初始化echarts实例时，设置autoResize为true，这样图表会自动随容器大小变化而重新渲染。

相关问题

ajax获取后端数据生成echart图标的代码

以下是一个基于jQuery和ECharts的示例代码，可以通过Ajax从后端获取数据并生成ECharts图表：

// HTML页面中引入ECharts和jQuery库

<script src="https://cdn.bootcdn.net/ajax/libs/echarts/5.2.0/echarts.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

// 定义一个HTML元素作为ECharts图表容器
<div id="chart" style="width: 600px;height:400px;"></div>

// 使用Ajax获取后端数据并生成ECharts图表
<script>
$(function(){
    $.ajax({
        url: 'your-backend-api-url',
        type: 'GET',
        dataType: 'json',
        success: function (data) {
            // 在控制台输出获取到的数据，确保数据格式正确
            console.log(data);
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('chart'));
            // 指定图表的配置项和数据
            var option = {
                // ECharts图表选项配置
                ...
                // 数据部分
                series: [{
                    name: '数据名称',
                    data: data, // 获取到的数据
                    type: 'bar' // 柱状图
                }]
            };
            // 使用刚指定的配置项和数据显示图表
            myChart.setOption(option);
        },
        error: function (data) {
            console.log(data);
        }
    });
});
</script>

其中，`your-backend-api-url`需要替换成你的后端API接口地址，返回的数据格式需要保证是ECharts所需的格式。具体的数据格式可以参考ECharts官方文档。

css echart 根据窗口大小自适应

要让 ECharts 图表根据窗口大小自适应，可以通过监听窗口大小变化事件，然后调用 ECharts 实例的 `resize` 方法来重新渲染图表。

下面是一个示例代码：

// 初始化 ECharts 实例
var myChart = echarts.init(document.getElementById('chart'));

// 监听窗口大小变化事件
window.addEventListener('resize', function () {
  // 调用 ECharts 实例的 resize 方法
  myChart.resize();
});

// 设置图表选项
var option = {
  // ...
};

// 渲染图表
myChart.setOption(option);

在这个示例中，我们首先初始化了一个 ECharts 实例 `myChart`，然后监听了窗口大小变化事件，当窗口大小发生变化时，调用了 `myChart.resize()` 方法重新渲染图表。

需要注意的是，由于 ECharts 实例是基于 DOM 元素的，因此在监听窗口大小变化事件时，需要将 ECharts 实例所在的 DOM 元素也一同调整大小，以确保图表的布局正确。