Echarts按需引入后沒有顯示圖例問題

因為Echarts官網的例子都是引入整個Echarts.js。如果使用按需引入對應模塊就要記得引入legend模塊，才能顯示出圖例。

例如這樣：

require("echarts/lib/component/legend");

像我使用Bar，我所引用的模塊有

// 引入基本模板
let echarts = require("echarts/lib/echarts");
// 引入柱狀圖組件
require("echarts/lib/chart/bar");
// 引入提示框和title組件
require("echarts/lib/component/tooltip");
require("echarts/lib/component/title");
// 引入legend模塊
require("echarts/lib/component/legend");

 如果要調整legend的位置，可以在legend同一級加上grid來調整相應的位置

例如：

legend: {
  orient: "vertical", // 垂直排列
  left: "right", // 像右對齊
  data: ["未完成", "已完成", "已過期"]
},
grid: {
  left: "3%", // 距離左邊3%
  right: "0",
  bottom: "0",
  top: "20%", // 頂部空出20%的空間，來顯示legend
  containLabel: true 
},