<!-- @format -->

<template>
  <div class="base-radar" id="baseradar" ref="BaseRadarRef"></div>
</template>
<script>
  import { defineComponent } from 'vue';
  import { init } from 'echarts';

  export default defineComponent({
    name: 'BaseRadar',
    props: {},
    data() {
      return {
        options: null,
      };
    },
    created() {},
    mounted() {},
    methods: {
      setOption(obj) {
        this.options = obj;
      },
      getOption() {
        return this.options;
      },
      renderChart() {
        if (!this.chartbox) {
          this.chartbox = init(this.$refs.BaseRadarRef, null, { renderer: 'svg' });
        }
        this.chartbox.clear();
        let option = this.getOption();
        this.chartbox.setOption(option, { notMerge: false });
      },
    },
  });
</script>
<style lang="less">
  .base-radar {
    height: 100%;
    width: 100%;
  }
</style>