技術標籤：元件視覺化大屏echarts

折線圖

color:調色盤顏色列表。如果系列沒有設定顏色，則會依次迴圈從該列表中取顏色作為系列顏色

在案例中的作用:改變標題線條顏色和折線顏色 使其能保持一致

legend:圖例元件(標題)展現了不同系列的標記(symbol)，顏色和名字

textStyle:圖例的公用文字樣式可改字型顏色和大小
orient：改變標題的佈局 （垂直or水平）
top、right、bottom、left :標題離容器左側的距離
itemGap：標題每項的間距

grid:可以控制
直角座標系內繪圖網格，單個 grid 內最多可以放置上下兩個 X 軸，左右兩個 Y 軸。可以在網格上繪製折線圖，柱狀圖，散點圖（氣泡圖）。

top、right、bottom、left :圖表離容器左側的距離

xAxis yAxis 對x、y軸進行設定

axisLine

lineStyle：可以改座標軸線條顏色

series 系列列表。每個系列通過 type 決定自己的圖表型別

type:指定圖表的型別
name:系列名稱，用於tooltip的顯示，legend 的圖例篩選，在 setOption 更新資料和配置項時用於指定對應的系列。
stack 資料堆疊，同個類目軸上系列配置相同的stack值後，後一個系列的值會在前一個系列的值上相加。
smooth:是否平滑曲線顯示。
data:資料

   lineOption: {
          color:['rgb(255,185,128)','rgb(90,177,239)','rgb(253,34,216)', 'rgb(24,185,154)'],
          legend: {
            data: ['告警資訊總量', '違規資訊總量', '紅頭資訊總量', '涉密資訊總量'],
            textStyle: {
              color: '#fff'
            }
          },
          tooltip: {
            trigger: 'axis'
          },
          textStyle: {
            color: '#fff'
          },
          grid: {
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
          },
          xAxis: {
            type: 'category',
            boundaryGap: false,
            data: ['1/1', '1/2', '1/3', '1/4', '1/5', '1/6', '1/7'],
            axisLine: {
              lineStyle: {
                color: '#fff'
              }
            }
          },
          yAxis: {
            type: 'value',
            axisLine: {
              lineStyle: {
                color: '#fff'
              }
            }
          },
          series: [
            {
              name: '告警資訊總量',
              type: 'line',
              stack: '總量',
              // smooth: true,
              data: [2820, 182, 191, 234, 290, 330, 310],
            },
            {
              name: '違規資訊總量',
              type: 'line',
              stack: '總量',
              // smooth: true,
              data: [1570, 2320, 2010, 1540, 1900, 3300, 4100],
              lineStyle: {
                color: 'rgb(90,177,239)'
              }
            },
            {
              name: '紅頭資訊總量',
              type: 'line',
              stack: '總量',
              // smooth: true,
              data: [3210, 3302, 3001, 3340, 3900, 3300, 3210],
            },
            {
              name: '涉密資訊總量',
              type: 'line',
              stack: '總量',
              // smooth: true,
              data: [2800, 1932, 1901, 1934, 1290, 1830, 1920],
            }
          ]
        }
      };