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 
},
原文地址:https://www.cnblogs.com/zhengshize/p/9660907.html