echartszomm等比缩放所有内容

要实现echarts等比缩放所有内容，可以使用echarts的dataZoom组件和resize方法结合实现。

首先，需要在echarts初始化时设置容器的宽度和高度，并配置好需要展示的图表数据。然后，在echarts的option中配置dataZoom组件，将其放置在底部或右侧，并设置相应的起始值和结束值，以便在缩放时能够正确展示数据。

接着，在窗口resize事件中，获取容器的实际宽度和高度，计算出容器宽度和高度与初始宽度和高度的比例，并调用echarts的resize方法，将图表缩放到合适的大小。同时，需要重新计算dataZoom的起始值和结束值，并调用echarts的setOption方法，更新dataZoom的配置。

下面是一个示例代码，可以参考一下：

// 初始化echarts，并设置容器大小和数据
var myChart = echarts.init(document.getElementById('main'));
myChart.setOption({...});

// 配置dataZoom组件
myChart.setOption({
  dataZoom: {
    type: 'inside',
    orient: 'horizontal',
    start: 0,
    end: 100
  }
});

// 监听窗口resize事件
window.onresize = function() {
  // 获取容器实际宽度和高度
  var containerWidth = document.getElementById('main').clientWidth;
  var containerHeight = document.getElementById('main').clientHeight;
  // 计算容器宽度和高度与初始宽度和高度的比例
  var widthRatio = containerWidth / initialWidth;
  var heightRatio = containerHeight / initialHeight;
  var resizeRatio = Math.min(widthRatio, heightRatio);
  // 调用echarts的resize方法，将图表缩放到合适的大小
  myChart.resize({
    width: initialWidth * resizeRatio,
    height: initialHeight * resizeRatio
  });
  // 重新计算dataZoom的起始值和结束值，并更新配置
  var dataZoomStart = myChart.getOption().dataZoom[0].start * resizeRatio;
  var dataZoomEnd = myChart.getOption().dataZoom[0].end * resizeRatio;
  myChart.setOption({
    dataZoom: {
      start: dataZoomStart,
      end: dataZoomEnd
    }
  });
};

需要注意的是，由于dataZoom组件的起始值和结束值是百分比形式，因此在缩放时需要将其乘以容器大小和初始大小的比例。