1

shuishen

2022-12-15 07c70221af864aa08474db57d0a95dde39c3fcdf

1

 src/views/home/components/leftContainer.vue

@@ -29,15 +29,20 @@
            <div id="PersonEcharts" class="echarts-box"></div>
            <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div>

            <svg viewBox="0 0 412 318" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <path class="mypath" d="M405.09,274c5.12,7.31,5,9.67,5,9c0.08,11.9,0.04,11.37,0,28c-0.4,3.71-3.02,6.38-7,7
    c-8.96,0.04-8.98,0.02-17,0c-13,0-6,0-19,0c-2.94-1.33-7.88-6.6-9-10c-22,0-46,0-68,0c-0.88,4.03-4.72,8.32-8,10
    c-62.33,0-126.67,0-189,0c-30.33,0-28.67,0-59,0c-9.38,0,0,0-26,0c-4.46,0.38-8.33-3.92-8-8c0-14,0-14,0-28
    c0.01-6.31,0.03-6.11,0-17c-0.15-11.16-0.08-0.09,0-11c-0.09-1.9,5.85-7.66,7-7c0.01-30.52,0.03-49.4,0-68
    c-0.03-20.37,0.05-18.8,0-28c-2.73-2.26-4.43-3.86-7-7c0-3.33,0-5.67,0-9c0-9.33,0-9.67,0-19c0-35.33,0-76.67,0-112
    c0.23-1.72,1.53-4,3-4c129.17-0.01,110.27,0,167,0c3.91,0.82,10.18,7.27,11,10c16.67,0,33.34,0,50,0c57.66,0,114.34,0,172,0
    c3.71,0.55,5.63,2.19,7,6c0.16,21.48,0,49.56,0,71c0,43,0.08,90.17,0,133c0.08,6.67,0-4.75,0,7c-0.33,0-0.42,5.75-5,7
    c0.04,13.79-0.08,10.66,0,19C405.09,266.07,405.11,261,405.09,274" />
            <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <defs>
                    <linearGradient id="linear" x1="0%" y1="0%" x2="100%" y2="0%">
                        <stop offset="0%" stop-color="#fff" />
                        <stop offset="100%" stop-color="rgba(33, 150, 243, 1)" />
                    </linearGradient>
                </defs>

                <path stroke-linecap="round" stroke="url(#linear)" class="mypath"
                    d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
    c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
    c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
    c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" />
            </svg>
        </div>
        <div class="house-box" style="position: relative;">
@@ -53,15 +58,13 @@
                </div>
            </div>
            <div id="houseEcharts" class="echarts-box"></div>
            <svg viewBox="0 0 412 318" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <path class="mypath" d="M405.09,274c5.12,7.31,5,9.67,5,9c0.08,11.9,0.04,11.37,0,28c-0.4,3.71-3.02,6.38-7,7
    c-8.96,0.04-8.98,0.02-17,0c-13,0-6,0-19,0c-2.94-1.33-7.88-6.6-9-10c-22,0-46,0-68,0c-0.88,4.03-4.72,8.32-8,10
    c-62.33,0-126.67,0-189,0c-30.33,0-28.67,0-59,0c-9.38,0,0,0-26,0c-4.46,0.38-8.33-3.92-8-8c0-14,0-14,0-28
    c0.01-6.31,0.03-6.11,0-17c-0.15-11.16-0.08-0.09,0-11c-0.09-1.9,5.85-7.66,7-7c0.01-30.52,0.03-49.4,0-68
    c-0.03-20.37,0.05-18.8,0-28c-2.73-2.26-4.43-3.86-7-7c0-3.33,0-5.67,0-9c0-9.33,0-9.67,0-19c0-35.33,0-76.67,0-112
    c0.23-1.72,1.53-4,3-4c129.17-0.01,110.27,0,167,0c3.91,0.82,10.18,7.27,11,10c16.67,0,33.34,0,50,0c57.66,0,114.34,0,172,0
    c3.71,0.55,5.63,2.19,7,6c0.16,21.48,0,49.56,0,71c0,43,0.08,90.17,0,133c0.08,6.67,0-4.75,0,7c-0.33,0-0.42,5.75-5,7
    c0.04,13.79-0.08,10.66,0,19C405.09,266.07,405.11,261,405.09,274" />
            <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <path stroke-linecap="round" stroke="url(#linear)" class="mypath"
                    d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
    c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
    c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
    c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" />
            </svg>
        </div>
        <div class="land-box" style="position: relative;">
@@ -77,15 +80,13 @@
                </div>
            </div>
            <div id="landEcharts" class="echarts-box"></div>
            <svg viewBox="0 0 412 318" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <path class="mypath" d="M405.09,274c5.12,7.31,5,9.67,5,9c0.08,11.9,0.04,11.37,0,28c-0.4,3.71-3.02,6.38-7,7
    c-8.96,0.04-8.98,0.02-17,0c-13,0-6,0-19,0c-2.94-1.33-7.88-6.6-9-10c-22,0-46,0-68,0c-0.88,4.03-4.72,8.32-8,10
    c-62.33,0-126.67,0-189,0c-30.33,0-28.67,0-59,0c-9.38,0,0,0-26,0c-4.46,0.38-8.33-3.92-8-8c0-14,0-14,0-28
    c0.01-6.31,0.03-6.11,0-17c-0.15-11.16-0.08-0.09,0-11c-0.09-1.9,5.85-7.66,7-7c0.01-30.52,0.03-49.4,0-68
    c-0.03-20.37,0.05-18.8,0-28c-2.73-2.26-4.43-3.86-7-7c0-3.33,0-5.67,0-9c0-9.33,0-9.67,0-19c0-35.33,0-76.67,0-112
    c0.23-1.72,1.53-4,3-4c129.17-0.01,110.27,0,167,0c3.91,0.82,10.18,7.27,11,10c16.67,0,33.34,0,50,0c57.66,0,114.34,0,172,0
    c3.71,0.55,5.63,2.19,7,6c0.16,21.48,0,49.56,0,71c0,43,0.08,90.17,0,133c0.08,6.67,0-4.75,0,7c-0.33,0-0.42,5.75-5,7
    c0.04,13.79-0.08,10.66,0,19C405.09,266.07,405.11,261,405.09,274" />
            <svg viewBox="0 0 384 329" width="100%" height="100%" style="position: absolute; top: 0; left: 0;">
                <path stroke-linecap="round" stroke="url(#linear)" class="mypath"
                    d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
    c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
    c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
    c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" />
            </svg>
        </div>
    </div>
@@ -1053,17 +1054,17 @@
}

.mypath {
    stroke: #05D380;
    // stroke: #05D380;
    stroke-width: 2;
    stroke-dasharray: 666;
    stroke-dashoffset: 666;
    stroke-dasharray: 20, 10, 5, 5, 5, 10;
    stroke-dashoffset: 888;
    fill: none;
    animation: go 4s linear infinite forwards;
    animation: go 12s linear infinite forwards;
}

@keyframes go {
    0% {
        stroke-dashoffset: 666;
        stroke-dashoffset: 888;
    }

    100% {