<script lang='ts' setup>

import { useAppStoreWithOut } from '@/store/modules/app'

const appStore = useAppStoreWithOut()

const boxStyle = computed(() => {
  return {
    width: (1 / appStore.getZoom) * 100 + '%',
    zoom: 1 / appStore.getZoom,
    transform: `scale(${appStore.getZoom})`,
    transformOrigin: 'left top'
  }
})

</script>

<template>


<div class="chart-box">
  <div :style="boxStyle" class="inner">
    <slot></slot>
  </div>
</div>

</template>

<style lang='scss' scoped>

.chart-box {
  position: relative;
  width: 100%;
  // overflow: hidden;
}

</style>