<div class="app-container">
    <div class="resize-container" id="reportResizeContainer">
      <!-- 圖表內容 -->
    </div>
</div>

/* 根據(jù)瀏覽器大小推斷縮放比例 */
getScale(width = 1920, height = 1080) {
   let ww = window.innerWidth / width
   let wh = window.innerHeight / height
   return ww < wh ? ww : wh
}
mounted() {
    let dom = document.getElementById('reportResizeContainer') as HTMLElement
    dom.style.transform = `scale(${this.getScale()}) translate(-50%, -50%)`
    dom.style.width = `1920px`
    dom.style.height = `1080px`
    window.addEventListener('resize', () => {
       if (dom) dom.style.transform = `scale(${this.getScale()}) translate(-50%, -50%)`
    })
}

.app-container {
    height: 100%;
    width: 100%;
}
.resize-container {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 999;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    transition: all 0.3s;
    transform-origin: left top;
}