echart - 待定

src/forge/Activity/Activity.js

@@ -242,8 +242,6 @@ class Activity extends Component{
             </div>
           }
         </div>
-        {
-          false ? 
           <div className="normalBox mt20">
             <div class="normalBox-title">项目演化分析</div>
             <div className="echartBox">
@@ -255,8 +253,6 @@ class Activity extends Component{
               <Pie />
             </div>
           </div>
-          :""
-        }
         <div className="commentsBox">
           <div className="trendsTop">
             <span>Issue/Pr记录</span>

src/forge/Activity/line.jsx

@@ -1,35 +1,54 @@
 import React ,{ useEffect } from 'react';
-import echarts from 'echarts/lib/echarts';
+import * as echarts from 'echarts';
 import 'echarts/lib/chart/line';
+import axios from 'axios';
 
-function Line({data}) {
+function Line() {
   useEffect(()=>{
     Init();
   },[])
 
   function Init() {
-    var huan_val = document.getElementById("line");
-    var myEcharts = echarts.init(huan_val);
-    let option = {
-      xAxis: {
-        type: 'category',
-        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
-      },
-      yAxis: {
-        type: 'value'
-      },
-      series: [
-        {
-          data: [150, 230, 224, 218, 135, 147, 260],
-          type: 'line'
-        },
-        {
-          data: [100, 200, 290, 300, 100, 140, 260],
-          type: 'line'
-        }
-      ]
-    };
-    myEcharts.setOption(option);
+    var chartDom = document.getElementById('line');
+    var myChart = echarts.init(chartDom);
+    var option;
+    axios.get('https://echarts.apache.org/examples/data/asset/data/aqi-beijing.json').then((result)=>{
+      console.log(result.data);
+      myChart.setOption(
+        (option = {
+          tooltip: {
+            trigger: 'axis'
+          },
+          color: ['orange'],
+          grid: {
+            left: '5%',
+            right: '1%',
+            bottom: '18%'
+          },
+          xAxis: {
+            data: result && result.data.map(function (item) {
+              return item[0];
+            })
+          },
+          yAxis: {},
+          dataZoom: [
+            {
+              startValue: '2014-06-01'
+            },
+            {
+              type: 'inside'
+            }
+          ],
+          series: {
+            type: 'line',
+            data: result && result.data.map(function (item) {
+              return item[1];
+            })
+          }
+        })
+      );
+    })
+    option && myChart.setOption(option);
   }
 
   return(