echarts 调整柱形图再canvas的占比

ECharts是一个强大的JavaScript数据可视化库，用于创建交互式图表。如果你想调整柱状图在Canvas上的占比，主要是通过设置`width`和`height`属性以及容器元素的大小来实现。

首先，你需要获取或设置ECharts实例的配置项，特别是`chart`部分的`width`和`height`。例如：

// 创建ECharts实例
var myChart = echarts.init(document.getElementById('main'));

// 配置项
var option = {
  // 其他配置...
  chart: {
    width: '50%', // 设置宽度为父元素的50%
    height: '400', // 设置高度为固定值或其他百分比
  },
  series: [{
    type: 'bar', // 柱状图类型
    data: [...]
  }]
};

// 绑定事件更新图表大小
window.addEventListener('resize', function() {
  myChart.resize(); // 当窗口大小变化时，调整图表尺寸
});

// 给ECharts实例加载配置
myChart.setOption(option);

在这个例子中，当页面窗口大小改变时，`resize`方法会被触发，自动调整柱状图在Canvas中的比例。