<template>
  <div class="full" id="charts-container">

  </div>
</template>

<script>
  import Charts from '@jiaminghi/charts'
    export default {
      mounted() {
        const container = document.getElementById('charts-container')
        this.myChart = new Charts(container);
        this.myChart.setOption(this.option);
      },
      name: "charts",
      data(){
        return {
          myChart: {}
        }
      },
      watch: {
        option(){
          this.myChart.setOption(this.option);
        }
      },
      props: {
        option: {
          type: 'Object',
          default: {}
        }
      },
    }
</script>

<style scoped>
    .full{
      width: 100%;
      height: 100%;
    }
</style>
