Merge remote-tracking branch 'origin/master'

baoshiwei

2025-04-19 5d36e1f987ef21e44ded2e8a1d06c28094ec1e76

 zhitan-vue/src/components/Echarts/LineChart.vue

@@ -1,6 +1,6 @@
<template>
  <div class="chart-item">
    <div id="ChartDom" style="width: 100%; height: 100%"></div>
    <div :id="domId" style="width: 100%; height: 100%"></div>
  </div>
</template>

@@ -18,6 +18,10 @@
  chartType: {
    type: String,
    default: "line", // bar
  },
  domId: {
    type: String,
    default: "ChartDom",
  },
})

@@ -44,31 +48,34 @@
  if (!props.chartData.xAxis) {
    return
  }
  const chartDom = document.getElementById("ChartDom")
  const chartDom = document.getElementById(props.domId)
  if (echarts.getInstanceByDom(chartDom)) {
    echarts.dispose(chartDom)
  }
  const myChart = echarts.init(chartDom)
  // 处理多系列数据
  const series = props.chartData.series.map((item) => ({
    ...item,
    name: item.name,
    type: props.chartType, // 根据传入类型渲染
    data: item.data,
    barWidth: "16",
    barWidth: props.chartData.barWidth || "16",
    itemStyle: {
      borderRadius: [15, 15, 0, 0],
    },
    smooth: true, // 启用平滑曲线
  }))
  console.log("initChart", series)
  let option = {
    title: {
      // text: props.chartData.title,
      text: props.chartData.title || "",
      left: "40",
      textStyle: {
        color: "#2979ff",
      },
    },
    color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
    color: ["#4dadf8", "#19be6b", "#ff9900", "#3d8a32", "#e8463a", "#ff4e3f"],
    // color: ["#2979ff", "#19be6b", "#ff9900", "#fa3534"],
    tooltip: {
      trigger: "axis",
      axisPointer: {