zoukankan      html  css  js  c++  java
  • 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 
    },
  • 相关阅读:
    2017.7.14 C组总结
    2017.7.13 C组总结
    2017.7.12 C组总结
    2017.7.10 C组总结
    2017.7.11 C组总结
    2017.7.9 C组 总结
    2017.7.8 C组总结
    2017.7.7 C组总结
    2017.7.6 C组总结
    SSL 2326——小球
  • 原文地址:https://www.cnblogs.com/zhengshize/p/9660907.html
Copyright © 2011-2022 走看看