要动态设置ApexCharts图表的高度为显示的行数，可以使用以下代码示例：

HTML代码：

JavaScript代码：

// 获取行数
function getRowCount() {
  // 获取每行的高度
  var rowHeight = 20; // 假设每行高度为20像素

  // 获取容器高度
  var containerHeight = document.getElementById('chart').offsetHeight;

  // 计算行数
  var rowCount = Math.floor(containerHeight / rowHeight);

  return rowCount;
}

// 动态设置图表高度
function setChartHeight() {
  var rowCount = getRowCount();

  // 设置图表配置
  var options = {
    chart: {
      height: rowCount * 20 // 设置图表高度为行数乘以每行的高度
    },
    series: [{
      data: [4, 8, 6, 2, 7, 5, 9, 3, 1]
    }],
    xaxis: {
      categories: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I']
    }
  };

  // 创建图表
  var chart = new ApexCharts(document.querySelector("#chart"), options);

  // 渲染图表
  chart.render();
}

// 页面加载完成后设置图表高度
window.addEventListener('load', setChartHeight);

// 窗口大小改变时重新设置图表高度
window.addEventListener('resize', setChartHeight);

这段代码首先定义了两个函数。getRowCount函数用于获取显示的行数，它假设每行的高度为20像素，通过获取容器的高度来计算行数。setChartHeight函数用于动态设置图表的高度，它首先调用getRowCount获取行数，然后根据行数计算图表的高度，并将图表配置中的chart.height属性设置为行数乘以每行的高度。最后，通过创建ApexCharts实例和调用render方法来渲染图表。

在页面加载完成后和窗口大小改变时，会自动调用setChartHeight函数来设置图表的高度。这样，无论页面加载时或者窗口大小改变时，图表的高度都会根据显示的行数进行动态调整。