动态溯源（编写中）

riku

2025-06-11 30cf71affd5149a1310d84f658b028d267beee8b

 src/components/chart/RealTimeLineChart.vue

@@ -1,6 +1,10 @@
<template>
  <div class="chart-wrap">
    <div ref="lineChart" class="line-chart"></div>
    <div
      ref="lineChart"
      class="line-chart"
      :style="'height:' + chartHeight + ';'"
    ></div>
  </div>
</template>
<script>
@@ -17,6 +21,10 @@
      //     series: []
      //   };
      // }
    },
    chartHeight: {
      type: String,
      default: '140px'
    }
  },
  data() {
@@ -44,6 +52,7 @@
      }
      if (this.lineChart) {
        this.lineChart.setOption(this.option, { notMerge: true });
        // console.log('折线图生成：立即');
      } else {
        this.onChartCreated = () => {
          this.lineChart.setOption(this.option, { notMerge: true });
@@ -53,9 +62,13 @@
  },
  mounted() {
    this.lineChart = echarts.init(this.$refs.lineChart);
    if (typeof this.onChartCreated === 'function') {
      this.onChartCreated();
    }
    this.onChartCreated();
    // setTimeout(() => {
    //   if (typeof this.onChartCreated === 'function') {
    //     this.onChartCreated();
    //     // console.log('折线图生成：滞后');
    //   }
    // }, 500);
  }
};
</script>
@@ -66,8 +79,8 @@
  justify-content: center;
}
.line-chart {
  width: 300px;
  height: 140px;
  width: 318px;
  /* height: 140px; */
  /* border-bottom: 1px solid rgba(255, 255, 255, 0.329); */
}
</style>