fix:修改图表颜色

ZhangXianQiang

2024-03-05 26ab0d5c9dba0b1bb8605f49195a8ebfd0e822e9

 src/views/daoAnOffice/right/analysis/index.vue

@@ -1,4 +1,5 @@
<!-- 交通安全形势研判分析 -->

<template>
  <RightTitle title="交通安全形势研判分析">
    <template #top>
@@ -9,6 +10,7 @@
        </div>
      </div>
    </template>

    <template #content>
      <div class="charts-container">
        <div id="analysisChart" ref="analysisChart"></div>
@@ -143,12 +145,22 @@
      color: '#4D76B0',
      margin: 15
    },
    axisLine: {
      lineStyle: {
        color: '#4d76b033'
      }
    }
  },
  yAxis: {
    axisLabel: {
      fontSize: 14,
      color: '#4D76B0',
    },
    splitLine: {
      lineStyle: {
        color: '#4d76b033'
      }
    }
  },
  series: [
    {
@@ -282,7 +294,11 @@
      },
      padding: [20, 25],
      formatter: function (params) {
        return params[0].name + '<br/>' + params[0].seriesName + ':' + `<span style="color:rgba(207, 178, 73, 1)">${params[0].value}</span>` + '<br/>' + params[1].seriesName + ':' + `<span style="color:rgba(43, 176, 109, 1)">${params[1].value}</span>`;
        let temp = params[0].name + '<br/>';
        params.forEach(element => {
          temp += element.seriesName + ':' + `<span style="color:${element.componentIndex === 1 ? '#2bb06d' : '#cfb249'}">${element.value}</span>` + '<br/>';
        });
        return temp;
      }
    },
    grid: {
@@ -300,13 +316,24 @@
        color: '#4D76B0',
        margin: 15
      },
      axisTick: false

      axisTick: false,
      axisLine: {
        lineStyle: {
          color: '#4d76b033'
        }
      }
    },
    yAxis: {
      type: 'value',
      axisLabel: {
        fontSize: 14,
        color: '#4D76B0'
      },
      splitLine: {
        lineStyle: {
          color: '#4d76b033'
        }
      }
    },
    series: [