From f9537176ce96bfc13a7d6e26bb6f2ec17def9bfb Mon Sep 17 00:00:00 2001
From: 小小儁爺 <1694218219@qq.com>
Date: 星期一, 01 七月 2024 17:42:35 +0800
Subject: [PATCH] 1.金华智研院看板   30%

---
 src/utils/myEcharts.js |  784 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 777 insertions(+), 7 deletions(-)

diff --git a/src/utils/myEcharts.js b/src/utils/myEcharts.js
index d67b615..d9ab55a 100644
--- a/src/utils/myEcharts.js
+++ b/src/utils/myEcharts.js
@@ -418,7 +418,7 @@
 
       // data: ['00:00','2:00','4:00','6:00','8:00','10:00','12:00','14:00','16:00','18:00','20:00',"22:00"],
       // data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�'],
-      data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�'],
+      data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�'],
       // type: 'category',
       // boundaryGap: true,
       // axisLabel: {
@@ -977,7 +977,7 @@
   ]
   const color = ['26,171,234', '73,226,196', '255,221,97']
   // const xList = ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
-  const xList = ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�']
+  const xList = ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
   const seriesData = []
 
   list.forEach((r, i) => {
@@ -1438,7 +1438,7 @@
       axisTick: {
         show: false
       },
-      data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�']
+      data: ['1鏈�', '2鏈�', '3鏈�', '4鏈�', '5鏈�', '6鏈�', '7鏈�', '8鏈�', '9鏈�', '10鏈�', '11鏈�', '12鏈�']
     }],
     yAxis: [
       {
@@ -1523,7 +1523,7 @@
           }
         },
         // data: [393, 438, 485, 631, 689, 824, 987]
-        data: [600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100)]
+        data: [600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100), 600 + Math.floor(Math.random() * 100)]
       }
       //   {
       //   name: '鏈�鏂版敞鍐岄噺',
@@ -2396,10 +2396,10 @@
 export function zhkb05() {
 // 鏁版嵁
 //   var XName = ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩']
-  var XName = ['01鏈�', '02鏈�', '03鏈�', '04鏈�', '05鏈�', '06鏈�', '07鏈�', '08鏈�', '09鏈�', '10鏈�']
+  var XName = ['01鏈�', '02鏈�', '03鏈�', '04鏈�', '05鏈�', '06鏈�', '07鏈�', '08鏈�', '09鏈�', '10鏈�', '11鏈�', '12鏈�']
   var data1 = [
     // [123, 121, 123, 321, 222, 111, 234, 121, 123, 321, 222, 321]
-    [Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300), Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300), Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300)]
+    [Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300), Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300), Math.ceil(Math.random() * 100 + 100), Math.ceil(Math.random() * 100 + 200), Math.ceil(Math.random() * 100 + 300)]
     // [123, 154, 234, 321, 120, 390, 634],
     // [63, 194, 234, 321, 278, 110, 534],
     // [53, 254, 234, 321, 118, 240, 434],
@@ -3220,7 +3220,7 @@
     xAxis: [
       {
         type: 'category',
-        data: ['01鏈�', '02鏈�', '03鏈�', '04鏈�', '05鏈�', '06鏈�', '07鏈�', '08鏈�', '09鏈�', '10鏈�'],
+        data: ['01鏈�', '02鏈�', '03鏈�', '04鏈�', '05鏈�', '06鏈�', '07鏈�', '08鏈�', '09鏈�', '10鏈�', '11鏈�', '12鏈�'],
         axisTick: {
           alignWithLabel: true
         },
@@ -3731,3 +3731,773 @@
 export function zhkb12() {
 
 }
+
+export function echart01() {
+  return {
+    // title: {
+    //   text: '2019骞撮攢鍞按閲忓拰涓昏惀涓氬姟鏀跺叆瀵规瘮',
+    //   textStyle: {
+    //     align: 'center',
+    //     color: '#fff',
+    //     fontSize: 20
+    //   },
+    //   top: '3%',
+    //   left: '10%'
+    // },
+    backgroundColor: 'transparent',
+    grid: {
+      left: '5%',
+      right: '5%',
+      bottom: '5%',
+      top: '30%',
+      containLabel: true
+    },
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: {
+        type: 'shadow',
+        label: {
+          show: true
+        }
+      }
+    },
+    legend: {
+      data: ['鎴愭湰', '鏁堢泭'],
+      top: '15%',
+      textStyle: {
+        color: '#ffffff'
+      }
+    },
+    xAxis: [
+      {
+        type: 'category',
+        data: ['01鏈�', '02鏈�', '03鏈�', '04鏈�', '05鏈�', '06鏈�', '07鏈�', '08鏈�', '09鏈�', '10鏈�', '11鏈�', '12鏈�'],
+        axisTick: {
+          alignWithLabel: true
+        },
+        nameTextStyle: {
+          color: '#82b0ec'
+        },
+        axisLine: {
+          lineStyle: {
+            color: '#82b0ec'
+          }
+        },
+        axisLabel: {
+          // margin: 5,
+          textStyle: {
+            // color: '#82b0ec'
+            color: colorX,
+            fontSize: 10
+          }
+        }
+      }
+    ],
+    yAxis: [
+      // {
+      //   type: 'value',
+      //   name: '浜垮厓',
+      //   nameTextStyle: {
+      //     color: '#ebf8ac'
+      //   },
+      //   splitLine: {
+      //     show: false
+      //   },
+      //   axisTick: {
+      //     show: true
+      //   },
+      //   axisLine: {
+      //     show: true,
+      //     lineStyle: {
+      //       color: '#FFFFFF'
+      //     }
+      //   },
+      //   axisLabel: {
+      //     show: true,
+      //     textStyle: {
+      //       color: '#ebf8ac'
+      //     }
+      //   }
+      //
+      // },
+
+      {
+        type: 'value',
+        gridIndex: 0,
+        min: 0,
+        max: 100,
+        splitNumber: 8,
+        splitLine: {
+          show: false
+        },
+        axisLine: {
+          show: false
+        },
+        axisTick: {
+          show: false
+        },
+        axisLabel: {
+          show: false
+        },
+        splitArea: {
+          show: true,
+          areaStyle: {
+            color: ['rgba(250,250,250,0.0)', 'rgba(250,250,250,0.05)']
+          }
+        }
+      },
+      {
+        type: 'value',
+        name: '',
+        nameTextStyle: {
+          color: '#ebf8ac'
+        },
+        position: 'left',
+        splitLine: {
+          show: false
+        },
+        axisTick: {
+          show: false
+        },
+        axisLine: {
+          show: false
+        },
+        axisLabel: {
+          show: true,
+          formatter: '{value} %', // 鍙充晶Y杞存枃瀛楁樉绀�
+          textStyle: {
+            color: colorX
+          }
+        }
+      }
+    ],
+    series: [
+      {
+        name: '鎴愭湰',
+        type: 'line',
+        yAxisIndex: 1, // 浣跨敤鐨� y 杞寸殑 index锛屽湪鍗曚釜鍥捐〃瀹炰緥涓瓨鍦ㄥ涓� y杞寸殑鏃跺�欐湁鐢�
+        smooth: true, // 骞虫粦鏇茬嚎鏄剧ず
+        showAllSymbol: true, // 鏄剧ず鎵�鏈夊浘褰€��
+        // symbol: 'circle', // 鏍囪鐨勫浘褰负瀹炲績鍦�
+        symbolSize: 5, // 鏍囪鐨勫ぇ灏�
+        itemStyle: {
+          // 鎶樼嚎鎷愮偣鏍囧織鐨勬牱寮�
+          color: '#058cff'
+        },
+        lineStyle: {
+          color: '#058cff'
+        },
+        areaStyle: {
+          color: 'rgba(5,140,255, 0.2)'
+        },
+        // data: [4.2, 3.8, 4.8, 3.5, 2.9, 2.8, 3, 5, 2.9, 2.8, 3, 5]
+
+        data: [100, 98, 99, 100, 100, 99, 98, 96, 97, 100, 100, 99]
+      },
+      {
+        name: '鏁堢泭',
+        type: 'bar',
+        barWidth: 15,
+        itemStyle: {
+          normal: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+              offset: 0,
+              color: '#00FFE3'
+            },
+            {
+              offset: 1,
+              color: '#4693EC'
+            }
+            ])
+          }
+        },
+        data: [28, 60, 30, 35, 27, 28, 33, 50, 29, 28, 36, 5]
+        // data: [100, 98, 99, 100, 100, 99, 98, 96, 97, 100, 100, 99]
+
+      }
+    ]
+  }
+}
+
+export function echart02() {
+  var img = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMYAAADGCAYAAACJm/9dAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAE/9JREFUeJztnXmQVeWZxn/dIA2UgsriGmNNrEQNTqSio0IEFXeFkqi4kpngEhXjqMm4MIldkrE1bnGIMmPcUkOiIi6gJIragLKI0Songo5ZJlHGFTADaoRuhZ4/nnPmnO4+l+7bfc85d3l+VV18373n3Ptyvve53/5+da1L6jDdYjgwBhgNHALMBn6Sq0VdcxlwGvACsAx4HliTq0VlRlNzY+LrfTO2o5LoDxwOHAmMA/4WiP+KzM3DqCJpAA4K/i4F2oBXgWbgWWAxsDEv48oZC6M9Q4EJwInAMcDAfM0pOXXA14K/y4FPgQXAfOBxYF1+ppUXFgYMBiYCp6PaoU+B694HFqEmyVJgVSbW9Y6bgCeBb6Am4GHALrH3B6L/+0RgM6pFHgQeAzZkaWi5UVejfYx64AjgXOAk1OToSCtqajyFHGZlVsalzH7oB+BYJJR+Cde0oKbi3cBCYEtWxmVNoT5GrQljGHAecD7wxYT3P0bNirlIEB9lZ1ouDEICOQk1H7dLuOYt4C7gZ8Da7EzLhloXxv7AJcCZdK4dWpAIHkDt7FrtjA5A/aszkFiSntP9wAzgP7M1LT0KCaM+YzuyZixy+leAb9O+sN9AHdDd0S/mbGpXFKD/+2z0LHZHz+aN2PsN6Bm+gjrsY7M2MEuqVRhHoU7yYjS6FPI5MAc4FNgHzUN4JKYz69Cz2Qc9qzno2YUcjZ7t8iBddVSbMEYDzwFPA6Nir28Afgx8CZiERpVM91iKntnfoGcYH606BNUez6GRr6qhWoSxF/AoKsQxsdfXAj9AHe2rgNXZm1Y1/A96hl8E/pn2HfExwBJUBntlb1rpqXRhbA/cDLyGxuJDPgSuBPYErqPGx+RLzAagCT3bK9GzDpmIyuJmVDYVS6UKow74e+APwPeIxuI/AX6Emkw3opldkw6fome8F3rmnwSv90Nl8gdURhU57FmJwtgHdfx+jpZwgCag7gW+DFyDa4gsWY+e+ZdRGYSTgUNRGS1GZVZRVJIwtgF+iMbQ4/2IF4ADgHOA93Kwy4j3UBkcgMokZAwqsx+iMqwIKkUYI4AXgelEzab1wAVoNOSVnOwynXkFlckFqIxAZTYdleGInOwqinIXRh1wMfASMDL2+hxgb+BOqngdTwWzBZXN3qisQkaisryYMu97lLMwhgHzgJ+ivRGgIcJJwd8HOdllus8HROUVDu/2R2U6D5VxWVKuwjgEVcnjY689jqrhOYl3mHJmDiq7x2OvjUdlfEguFnVBOQrju2gmdbcgvwmYitbweFtm5bIGleFUVKagMn4OlXlZUU7C6A/MQqs3w9GLN4ADgZloW6apbNpQWR5ItEBxG1Tms4iazLlTLsLYCW2IOTv22iNor3Il7JQzxbEKle0jsdfORj6wUy4WdaAchDEC+A1RW3MzcAVwKtW/UaiW+QiV8RWozEE+8Bu0yzBX8hbGwaiNuUeQ/xi1Q2/CTadaoA2V9Umo7EG+8Dw57/fIUxhHAs8AOwb5t9Cy8fm5WWTyYj4q+7eC/PZoOfspeRmUlzBOBn4FbBvkX0XVaLUEHDDFsxL5wG+DfAOKWHJOHsbkIYwpaAtluLRjEdol5nVO5j20tmpRkO+DAjFclLUhWQvjUhSSJYzdNA84DneyTcRHyCfmBfk64HYUbjQzshTGVOBWojUys9GoREuGNpjKoAX5xuwgXwfcQoY1R1bCmILWx4SimAWcBXyW0febyuMz5COzgnxYc0zJ4suzEMZEFKwrFMVDKAzL5oJ3GCM2I195KMjXIV86Ke0vTlsYR6CRhbBPMReYjEVhus9mNCseRpfvg5pYR6T5pWkKYz8UNSIcfVqIzmpoTfE7TXXyGfKdhUG+H/Kt1GbI0xLGMODXKJI4aIz6m1gUpue0Ih8Kw4MORj6Wyp6ONITRADyBwjyC4hEdjwMUmN6zAUU+fDPI7458LSlafa9IQxh3oZWToP/ICcDbKXyPqU3WouDT4Q/tQcjnSkqphXEJ6lyDOk2T8TIPU3pW0n4QZzLyvZJRSmGMQislQ65C1ZwxafAEioQYchPt4xX3ilIJYygaaw5HoB5BM5XGpMmtwMNBuh/ywaGFL+8+pRBGHYpAF+7R/h2anfR+CpM2bWj1bbhNdjfki70OzVMKYVxEFM1jE955Z7Il3AkYHvoznhKsqeqtML6KIluHfB93tk32rEK+F3Iz8s0e0xth9EXVVhjZ4QkUAcKYPPg3orhV/YH76MVx3b0RxhXA3wXpdehoYPcrTF60oRN5w6PjDkQ+2iN6Kox9UOj3kAtxMDSTP2uQL4ZcA+zbkw/qiTDqULUVTsM/RDRkZkzePEy0TL0B+WrRo1Q9Eca3iEKbrKfEM47GlIBLgP8N0mPQyU5FUawwdqDz7Lajjpty4wPg6lj+RqIwTd2iWGE0Ei3zXUEKi7eMKRF3IR8F+ew1W7m2E8UI4ytEEydbUIRqH9piypWOPnoR8uFuUYwwbiKKQj4LeLmIe43Jg5eJgilsQ/tuwFbprjBGEy37+IT27TdjypmriY5aHo/OB+yS7grjulj6JzhqoKkc3gNui+X/pTs3dUcYRxMNz/4FLyc3lcfNyHdBvnxMVzd0RxiNsfQNeO+2qTw2IN8N6XKEqithjCXaFbUWuKNndhmTOzOJ1lGNoovzN7oSxrRY+jbg057bZUyu/BX1j0OmFboQti6Mkah/AVr64SXlptKZiXwZ5NsjC124NWFcGkvfHftAYyqV9bRfrXFpoQvrWpckLjwcigKl9Qc+B74ErC6hgcbkxR7Af6NNTK3Abk3Njes6XlSoxvgO0c68R7EoTPWwGvk0KLLIBUkXJQmjHu3GC5lRWruMyZ24T58zbdy1nXSQJIxxwJ5B+nVgWentMiZXliHfBvn6kR0vSBJG/JTMu0tvkzFlQdy3O53S1LHzPRht8mhA56DtTjQpYkw1MQR4h8jXd25qbvz/kdeONcZEor3cT2FRmOrlQ3S+Bsjn2x1f1lEYZ8TSD6RolDHlwP2x9JnxN+JNqWHAu2h892NgZ7wExFQ3A4H3ge3QkQK7NjU3roH2NcaJRJHb5mNRmOrnU+TroEMvw8147YQxIZaeizG1QdzXTwwTYVNqAOpoD0Q99GGoOWVMtTMIRTBsQBHThzQ1N24Ma4zDkCgAFmNRmBqhqbnxI+C5IDsAOByiplR85m9BhnYZUw48FUsfCcnCeCYzc4wpD+I+Pw7UxxiOhqzq0HDtbgk3GlOVNDUrpMG0cde+A+yKjhPYuR7F2QknM57PxTpj8ifsZ9QBh9ajYGohS7O3x5iyIL6KfFQ9cHDsBQvD1Cpx3z+4LzAHnV3Whg75M6YWWQVciZpSrYX2fBtTE4Sd746U4pxvY6oOC8OYBCwMYxKwMIxJwMIwJgELw5gELAxjErAwjEnAwjAmAQvDmAQsDGMSsDCMScDCMCYBC8OYBCwMYxKwMIxJwMIwJgELw5gELAxjErAwjEnAwjAmAQvDmAQsDGMSsDCMScDCMCYBC8OYBCwMYxKwMIxJwMIwJgELw5gELAxjErAwjEnAwjAmAQvDmAQsDGMSsDCMScDCMCYBC8OYBCwMYxLoC1wKNABtwC3A5lwtMiYHpo27tg/wPaAOaO0LnAqMCt5fAPw2J9uMyZMRwI+D9PJ6YEXszW9kb48xZUHc91fUA8sKvGlMLTE6ll5eDyxF/QuAMdnbY0xZMDb4tw1YUg+sAVYGL+6K2lrG1AzTxl07Avk+wMqm5sY14XBtc+y6o7I1y5jcift8M0TzGM/E3jgmM3OMKQ+OjaWfBahrXVIHMABYBwwEWoBhwMdZW2dMDgxC3YkGYCMwpKm5cWNYY2wEng7SDcBx2dtnTC4ci3weYEFTc+NGaL8k5IlY+qSsrDImZ+K+/qsw0VEYnwfpE1GzyphqZgDyddBSqMfDN+LCWAssCtLbAeMzMc2Y/DgB+TrAwqbmxjXhGx1X194fS5+WtlXG5MyZsfQD8Tc6CmMuGpUCOB4YkqJRxuTJEOTjIJ9/LP5mR2GsR+IA9dS/lappxuTHZKLRqLlNzY3r428mbVS6N5Y+Ny2rjMmZuG/f2/HNJGE8C7wZpPel/apDY6qB0cBXg/SbBLPdcZKEsQW4J5a/pORmGZMvcZ++p6m5cUvHCwrt+f53ok74N4E9SmyYMXmxB/JpgFbk650oJIx1wOwg3Rf4bklNMyY/LkY+DfBgU3PjuqSLthYl5LZY+lxg+xIZZkxeDAbOi+VvK3Th1oTxCtHCwu2BC3tvlzG5chHRD/wzyMcT6SquVFMsfRleP2Uql4HIh0Ou39rFXQnjOWB5kB4GTO25XcbkylTkwyCfXrSVa7sViXB6LH0VaqcZU0kMRr4b8qOubuiOMBagmgNgR+Dy4u0yJle+j3wX5MtPdXVDd2PX/iCWvhzYpTi7jMmNXVAY2pAfFLowTneFsZRoh9+2dNFxMaaMuB75LMiHl3bnpmKinf8T8FmQngwcUMS9xuTBAchXQb57RXdvLEYYvwNmxu77aZH3G5MlHX10JvBGMTcXw3S0BRbgYNrPIhpTTpyHfBS0xGn6Vq7tRLHC+AtqUoVcD+xU5GcYkzbDad8PvgL5brfpSVPoP4iGb3cA/rUHn2FMmsxAvgnwPPDzYj+gJ8JoQ+umwmXppwGn9OBzjEmDU4gCebQgX20rfHkyPe08/xft22wzUfVlTJ4MB+6I5acDr/fkg3ozqnQj8FKQHgbchc4vMyYP6pAPhj/QLyMf7RG9EcbnwLeBTUF+Al6abvLjQuSDoCbUPxBF1iya3s5DvEb7SZNbgP16+ZnGFMsI4OZY/irkmz2mFBN0twPzg3R/YA4KrW5MFgxCPjcgyD9JCUZKSyGMNmAK8E6Q/wqK0+P+hkmbOhTRZu8g/w5qQhU9CtWRUi3pWIuGyFqD/MnoMHFj0uRyoqmCVuSDawpf3n1KudZpGe1nxW/AEdNNeownOrAe5HvLClxbNKVeBDgD+EWQ7gPMwp1xU3r2Q77VJ8j/AvleyUhjdex5wItBejA6pWb3FL7H1CbD0AEv4RbrF0lhMWsawtiExpPfDvJfAH6N94qb3jMYhXTaM8i/jXxtU6Ebekpa+ynWoLMHNgT5/YBHgX4pfZ+pfvohH9o/yG9APlaSznZH0txotBLFCA1Hqo5AYT8tDlMs2yDfOSLItyLfWpnWF6a9A28hcBY6+A90Qma802RMV/RBnevwdNXN6IiwhWl+aRZbUx8GvkM06TIJuA+Lw3RNH+Qrk4J8G3A+8EjaX5zVnu170JkEoTgmA79EVaQxSWyDaoowmEEb8qFOpx+lQZbBDG5HM5WhOE4DHsJ9DtOZfsg3Tg/ybSho2u1ZGZB1lI/bUFUY73M8hRcdmohBaCFg2KdoQ+ez3JqlEXmEv7mb9uuqDkd7yB3d0OyMfCEcfdqMfkjvKHhHSuQVF+oR4ETgr0F+fxSB2stHapcRwAtE8xQtwBnohzRz8gyY9gxwJFFYkz3RIrAT8jLI5MYJ6IdxzyC/HjgO7bPIhbwjCa4ADgNWB/ntgHlopaT3c1Q/dahTPQ+VPcgXxtLF+RVpk7cwQLOXB6FqFDR2fSPeCVjthDvvbiKa01qBfOHVvIwKKQdhALyPOly/jL12Mlo5OSIXi0yajEBle3LstfvRQMz7uVjUgXIRBmiF5NnAPxJFVd8bhei5CDetqoE6VJYvEW1H/QyV+VmksEq2p5STMEJmoF+OcA95fzRcNxcHdatkhqMyvAOVKaiMD6PEm4xKQTkKAzQ6NRJtcgqZgPojp+ZikekNp6CymxB7bT4q4+WJd+RMuQoDFGBhPKpmwyp2OFoqMBtHWa8EhgMPok52WNtvQjPZE4iOlCg7ylkYoOUAM4ADaX9Y+SQUP/d8yv//UIvUo7J5gyjAMqgMD0Rrnnod4iZNKsWpVqFhvEaipSQ7AHcCS1CVbMqDkahM7iQKxd+Kyu4gVJZlT6UIAzR6MZ3owYeMQgF878HrrfJkF1QGL6MyCQl/uKYTjTaWPZUkjJDX0czoFHSEFOj/MQX4PXAtDryQJYPRM/89KoPQp9YF+bH0MBR/nlSiMEDt0/vQWPhMoqjW2wLXAH9Ey0oG5mJdbTAQPeM/omceHhn8OSqTfVAZlXVfohCVKoyQD4GpwNdQiJ6QoWhZyZ+BaXhpSSkZhJ7pn9EzHhp770lUFlOJavOKpNKFEfI6WqF5KO37H8OB69DCtBtQjCvTM76ADnxcjZ5pfLJ1CXr2x1OBzaYkqkUYIUuBMcAxRIsSQe3gK4E/oTmQ0dmbVrGMRs/sT+jciXj/bQVwLHrmS7M3LT2qTRghT6ORkcODdEhfNAeyFB0schmwY+bWlT9D0LN5DT2rSejZhTyNnu0hwILMrcuAahVGyGJUe3wdHWnbEntvX7SP+F3gMbTUZAC1ywAkgMfQGqZb0TMKaUHP8OvomS7O1rxsqWtdUlOLVoejGdnzgD0S3v8IreGZi4I0fJydabmwHWoKTUR9tKRBitXo0MefkVI4zDxpam5MfL3WhBFSj/Z/nI/W7DQkXNOCdpE9jbbhVsSMbTcYARwFHI2aQ4X+748jQTQDWzKzLmMKCaNv4qvVzxbg2eBve/SLeTowjmg3WQP6NT02yL+Lmg/Lgr9VRGGAypU+SAijg7/DgF0LXLsZiWA2Cp68PgP7ypZarTEKMQzVIOPRr+rWJgivRkPA5cxVaIi1EJ+i2vAJVEOU7WrXtHCN0T3WovU+96DO6OEoksk4FNqn0n9F2tC+iGZUWy4CNuZqUZliYRRmI5pND2fUd0JDwKPRMGVLgfvKiRa0EegF1PxbDnyQq0UVwv8BNYmwIpIWBvwAAAAASUVORK5CYII='
+
+  var trafficWay = [
+    {
+      name: '鍘嬪嵃',
+      value: 20
+    }, {
+      name: '瀛斿皬',
+      value: 10
+    }, {
+      name: '鍙樺舰',
+      value: 30
+    }, {
+      name: '鍒掍激',
+      value: 20
+    }, {
+      name: '鎶攱',
+      value: 20
+    }]
+
+  var data = []
+  var color = ['#00ffff', '#00cfff', '#006ced', '#ffe000', '#ffa800', '#ff5b00', '#ff3000']
+  for (var i = 0; i < trafficWay.length; i++) {
+    data.push({
+      value: trafficWay[i].value,
+      name: trafficWay[i].name,
+      itemStyle: {
+        normal: {
+          borderWidth: 5,
+          shadowBlur: 20,
+          borderColor: color[i],
+          shadowColor: color[i]
+        }
+      }
+    }, {
+      value: 2,
+      name: '',
+      itemStyle: {
+        normal: {
+          label: {
+            show: false
+          },
+          labelLine: {
+            show: false
+          },
+          color: 'rgba(0, 0, 0, 0)',
+          borderColor: 'rgba(0, 0, 0, 0)',
+          borderWidth: 0
+        }
+      }
+    })
+  }
+  var seriesOption = [{
+    name: '',
+    type: 'pie',
+    clockWise: false,
+    radius: [60, 66],
+    hoverAnimation: false,
+    itemStyle: {
+      normal: {
+        label: {
+          show: true,
+          position: 'outside',
+          color: '#ddd',
+          formatter: function(params) {
+            var percent = 0
+            var total = 0
+            for (var i = 0; i < trafficWay.length; i++) {
+              total += trafficWay[i].value
+            }
+            percent = ((params.value / total) * 100).toFixed(0)
+            if (params.name !== '') {
+              // return '缂洪櫡鍚嶇О锛�' + params.name + '\n' + '\n' + '鍗犵櫨鍒嗘瘮锛�' + percent + '%'
+              return params.name + ' ' + percent + '%'
+            } else {
+              return ''
+            }
+          }
+        },
+        labelLine: {
+          length: 10,
+          length2: 30,
+          show: true,
+          color: '#00ffff'
+        }
+      }
+    },
+    data: data
+  }]
+  const option = {
+    backgroundColor: 'transparent',
+    color: color,
+    title: {
+      text: '',
+      top: '48%',
+      textAlign: 'center',
+      left: '49%',
+      textStyle: {
+        color: '#fff',
+        fontSize: 22,
+        fontWeight: '400'
+      }
+    },
+    graphic: {
+      elements: [{
+        type: 'image',
+        z: 3,
+        style: {
+          image: img,
+          width: 88,
+          height: 88
+        },
+        left: 'center',
+        top: 'center',
+        position: [100, 100]
+      }]
+    },
+    tooltip: {
+      show: false
+    },
+    // legend: {
+    //   icon: 'circle',
+    //   orient: 'horizontal',
+    //   // x: 'left',
+    //   data: ['鍘嬪嵃', '瀛斿皬', '鍙樺舰', '鎶攱'],
+    //   right: 340,
+    //   bottom: 150,
+    //   align: 'right',
+    //   textStyle: {
+    //     color: '#fff'
+    //   },
+    //   itemGap: 20
+    // },
+    toolbox: {
+      show: false
+    },
+    series: seriesOption
+  }
+
+  return option
+}
+
+export function echart03() {
+  return {
+    // title: {
+    //   text: '2019骞撮攢鍞按閲忓拰涓昏惀涓氬姟鏀跺叆瀵规瘮',
+    //   textStyle: {
+    //     align: 'center',
+    //     color: '#fff',
+    //     fontSize: 20
+    //   },
+    //   top: '3%',
+    //   left: '10%'
+    // },
+    backgroundColor: 'transparent',
+    grid: {
+      left: '5%',
+      right: '5%',
+      bottom: '5%',
+      top: '20%',
+      containLabel: true
+    },
+    tooltip: {
+      trigger: 'axis',
+      axisPointer: {
+        type: 'shadow',
+        label: {
+          show: true
+        }
+      }
+    },
+    xAxis: [
+      {
+        type: 'category',
+        data: ['鍘嬪嵃', '瀛斿皬', '鍙樺舰', '鍒掍激', '鎶攱'],
+        axisTick: {
+          alignWithLabel: true
+        },
+        nameTextStyle: {
+          color: '#82b0ec'
+        },
+        axisLine: {
+          lineStyle: {
+            color: '#82b0ec'
+          }
+        },
+        axisLabel: {
+          // margin: 5,
+          textStyle: {
+            // color: '#82b0ec'
+            color: colorX,
+            fontSize: 16
+          }
+        }
+      }
+    ],
+    yAxis: [
+      {
+        boundaryGap: false,
+        splitNumber: 4,
+        type: 'value',
+        // name: '%',
+        nameTextStyle: {
+          color: colorY,
+          fontSize: 14,
+          lineHeight: 20
+        },
+        axisLabel: {
+          textStyle: {
+            fontSize: 14,
+            // color: '#7696c5'
+            color: colorX
+            // color: this.colorY
+          }
+        },
+        splitLine: {
+          show: true,
+          lineStyle: {
+            color: '#032c58'
+          }
+        },
+        axisLine: {
+          show: true,
+          lineStyle: {
+            color: '#032c58'
+          }
+        },
+        axisTick: {
+          show: true
+        }
+      }
+    ],
+    series: [
+      {
+        name: '鏁伴噺',
+        type: 'bar',
+        barWidth: 25,
+        itemStyle: {
+          normal: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+              offset: 0,
+              color: '#00FFE3'
+            },
+            {
+              offset: 1,
+              color: '#4693EC'
+            }
+            ])
+          }
+        },
+        data: [228, 260, 230, 235, 227, 228, 233]
+        // data: [100, 98, 99, 100, 100, 99, 98, 96, 97, 100, 100, 99]
+
+      }
+    ]
+  }
+}
+
+export function echart04() {
+  const indicatorList = [{
+    name: '浜哄伐鏅鸿兘鍥惧儚璇嗗埆'
+  },
+  {
+    name: '寮�鍙戣�呭伐鍏�'
+  },
+  {
+    name: '鑷姩鍏夊妫�娴�'
+  },
+  {
+    name: '铏氭嫙閲忔祴VM'
+  },
+  {
+    name: '楂橀娴烽噺鏁版嵁鍒嗘瀽'
+  }]
+  const option = {
+    backgroundColor: 'transparent',
+    color: ['#0290ff', '#ffe533', '#ff4d4d', '#06f5bc'],
+    tooltip: {
+      show: false // 寮瑰眰鏁版嵁鍘绘帀
+    },
+    legend: {
+      data: [
+        {
+          name: '浣跨敤鐜�', icon: 'rect', itemStyle: {
+            color: '#06f5bc', borderWidth: 0
+          }
+        },
+        {
+          name: '瀹為檯浣跨敤鐜�', icon: 'rect', itemStyle: {
+            color: '#0290ff', borderWidth: 0
+          }
+        }
+      ],
+
+      top: 30,
+      show: true,
+      y: '1',
+      center: 0,
+      itemWidth: 12,
+      itemHeight: 12,
+      itemGap: 26,
+      z: 3,
+      // orient: 'horizontal',
+      textStyle: {
+        fontSize: 14,
+        color: '#edf8ff'
+      }
+    },
+    radar: {
+      center: ['50%', '65%'], // 澶栧渾鐨勪綅缃�
+      radius: '55%',
+      name: {
+        textStyle: {
+          color: '#fff',
+          fontSize: 14,
+          fontWeight: 400,
+          fontFamily: 'PingFangSC-Regular,PingFang SC',
+          fontStyle: 'normal'
+        }
+      },
+      // TODO:
+      indicator: indicatorList,
+      splitArea: {
+        // 鍧愭爣杞村湪 grid 鍖哄煙涓殑鍒嗛殧鍖哄煙锛岄粯璁や笉鏄剧ず銆�
+        show: true,
+        areaStyle: {
+          // 鍒嗛殧鍖哄煙鐨勬牱寮忚缃��
+          color: ['rgba(255,255,255,0)'] // 鍒嗛殧鍖哄煙棰滆壊銆傚垎闅斿尯鍩熶細鎸夋暟缁勪腑棰滆壊鐨勯『搴忎緷娆″惊鐜缃鑹层�傞粯璁ゆ槸涓�涓繁娴呯殑闂撮殧鑹层��
+        }
+      },
+      axisLine: {
+        // 鎸囧悜澶栧湀鏂囨湰鐨勫垎闅旂嚎鏍峰紡
+        lineStyle: {
+          color: 'rgba(255,255,255,0)'
+        }
+      },
+      splitLine: {
+        lineStyle: {
+          type: 'solid',
+          color: '#0ac8ff', // 鍒嗛殧绾块鑹�
+          width: 2 // 鍒嗛殧绾跨嚎瀹�
+        }
+      }
+    },
+    series: [
+      {
+        type: 'radar',
+        data: [
+          {
+            value: [0, 0, 10, 30, 70],
+            name: '浣跨敤鐜�',
+            areaStyle: {
+              normal: {
+                color: {
+                  type: 'radial',
+                  x: 0.5,
+                  y: 0.5,
+                  r: 0.5,
+                  colorStops: [{
+                    offset: 0, color: '#00ffb4' // 0% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 0.15, color: '#00ffb4' // 100% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 0.75, color: '#00ffb4' // 100% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 1, color: '#00ffb4' // 100% 澶勭殑棰滆壊
+                  }],
+                  global: false // 缂虹渷涓� false
+                }
+              }
+            },
+            symbolSize: [6, 6],
+            lineStyle: { // 杈圭紭棰滆壊
+              //  width: 0
+              color: 'rgba(13, 248, 172, 0.8)'
+              // shadowBlur:8,
+              // shadowColor:'#ff3838'
+            },
+            itemStyle: {
+              color: '#fff',
+              borderColor: '#00ffb4',
+              borderWidth: 1,
+              shadowBlur: 8,
+              shadowColor: '#00ffb4'
+            }
+          },
+          {
+            value: [80, 80, 80, 70, 60],
+            name: '瀹為檯浣跨敤鐜�',
+            areaStyle: {
+              normal: {
+                color: {
+                  type: 'radial',
+                  x: 0.5,
+                  y: 0.5,
+                  r: 0.5,
+                  colorStops: [{
+                    offset: 0, color: 'rgba(0,194,255, 0.8)' // 0% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 0.15, color: 'rgba(0,194,255, 0.8)' // 100% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 0.75, color: 'rgba(0,194,255, 0.8)' // 100% 澶勭殑棰滆壊
+                  },
+                  {
+                    offset: 1, color: 'rgba(0,194,255, 0.8)' // 100% 澶勭殑棰滆壊
+                  }],
+                  global: false // 缂虹渷涓� false
+                }
+              }
+            },
+            symbolSize: [6, 6],
+            lineStyle: { // 杈圭紭棰滆壊
+              //  width: 0
+              color: 'rgba(0, 194, 255, 0.8)'
+              // shadowBlur:8,
+              // shadowColor:'#ff3838'
+            },
+            itemStyle: {
+              color: '#fff',
+              borderColor: '#00c8ff',
+              borderWidth: 1,
+              shadowBlur: 8,
+              shadowColor: '#00c8ff'
+            }
+          }
+
+        ]
+      }
+    ]
+  }
+
+  return option
+}
+
+export function echart05() {
+  var img = 'data:image/png;base64,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'
+
+  var trafficWay = [
+    {
+      name: '渚涘簲瀹㈡埛',
+      value: 9
+    }, {
+      name: '鐜板満绠$悊鑰�',
+      value: 30
+    }, {
+      name: '宸ュ巶绠$悊鑰�',
+      value: 25
+    }, {
+      name: '浼佷笟鍐崇瓥鑰�',
+      value: 23
+    }, {
+      name: '骞冲彴寮�鍙戣��',
+      value: 14
+    }]
+
+  var data = []
+  var color = ['#00ffff', '#00cfff', '#006ced', '#ffe000', '#ffa800', '#ff5b00', '#ff3000']
+  for (var i = 0; i < trafficWay.length; i++) {
+    data.push({
+      value: trafficWay[i].value,
+      name: trafficWay[i].name,
+      itemStyle: {
+        normal: {
+          borderWidth: 5,
+          shadowBlur: 20,
+          borderColor: color[i],
+          shadowColor: color[i]
+        }
+      }
+    }, {
+      value: 2,
+      name: '',
+      itemStyle: {
+        normal: {
+          label: {
+            show: false
+          },
+          labelLine: {
+            show: false
+          },
+          color: 'rgba(0, 0, 0, 0)',
+          borderColor: 'rgba(0, 0, 0, 0)',
+          borderWidth: 0
+        }
+      }
+    })
+  }
+  var seriesOption = [{
+    name: '',
+    type: 'pie',
+    clockWise: false,
+    radius: [60, 66],
+    hoverAnimation: false,
+    itemStyle: {
+      normal: {
+        label: {
+          show: true,
+          position: 'outside',
+          color: '#ddd',
+          formatter: function(params) {
+            var percent = 0
+            var total = 0
+            for (var i = 0; i < trafficWay.length; i++) {
+              total += trafficWay[i].value
+            }
+            percent = ((params.value / total) * 100).toFixed(0)
+            if (params.name !== '') {
+              // return '缂洪櫡鍚嶇О锛�' + params.name + '\n' + '\n' + '鍗犵櫨鍒嗘瘮锛�' + percent + '%'
+              return params.name + ' ' + percent + '%'
+            } else {
+              return ''
+            }
+          }
+        },
+        labelLine: {
+          length: 10,
+          length2: 30,
+          show: true,
+          color: '#00ffff'
+        }
+      }
+    },
+    data: data
+  }]
+  const option = {
+    backgroundColor: 'transparent',
+    color: color,
+    title: {
+      text: '',
+      top: '48%',
+      textAlign: 'center',
+      left: '49%',
+      textStyle: {
+        color: '#fff',
+        fontSize: 22,
+        fontWeight: '400'
+      }
+    },
+    graphic: {
+      elements: [{
+        type: 'image',
+        z: 3,
+        style: {
+          image: img,
+          width: 88,
+          height: 88
+        },
+        left: 'center',
+        top: 'center',
+        position: [100, 100]
+      }]
+    },
+    tooltip: {
+      show: false
+    },
+    // legend: {
+    //   icon: 'circle',
+    //   orient: 'horizontal',
+    //   // x: 'left',
+    //   data: ['鍘嬪嵃', '瀛斿皬', '鍙樺舰', '鎶攱'],
+    //   right: 340,
+    //   bottom: 150,
+    //   align: 'right',
+    //   textStyle: {
+    //     color: '#fff'
+    //   },
+    //   itemGap: 20
+    // },
+    toolbox: {
+      show: false
+    },
+    series: seriesOption
+  }
+
+  return option
+}

--
Gitblit v1.9.3