<template>
  <LEchart class="echart" ref="chart" @finished="init" :customStyle="{height: height, 'z-index': 1}"></LEchart>
</template>
<script setup lang="ts">
import LEchart from "../../uni_modules/lime-echart/components/l-echart/l-echart.vue";
// import limeEchart from "../../uni_modules/lime-echart/components/lime-echart/lime-echart";

// #ifdef VUE3
// #ifdef MP
// 由于vue3 使用vite 不支持umd格式的包，小程序依然可以使用，但需要使用require
const echarts = require("../../uni_modules/lime-echart/static/echarts.min");
// #endif
// #ifndef MP
// 由于 vue3 使用vite 不支持umd格式的包，故引入npm的包
import * as echarts from "echarts";
// #endif
// #endif
let chart = ref(); // 获取dom

const props = defineProps<{
  option: object,
  height: string
}>()

watchEffect(() => {
  chart.value.init(echarts, (chart: any) => {
    chart.setOption(props.option);
  });
});

// 渲染完成
const init = () => {
  console.log("渲染完成");
};
</script>
<style lang="scss" scoped>
.echart {
  width: 100%;
  height: 100%;
}

.title {
  text-align: center;
}
</style>
