因为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
},

Echarts按需引入后没有显示图例问题的更多相关文章

  1. vue项目使用echarts按需引入实现地图动态显示效果时,报错:TypeError: Cannot read property 'dataToPoint' of undefined

    vue项目使用echarts按需引入实现地图动态显示效果时,报错:TypeError: Cannot read property 'dataToPoint' of undefined 借鉴了该大神的文 ...

  2. matplotlib画图无法显示图例 报错No handles with labels found to put in legend.

    很久没有matplotlib了,今天画图的时候发现了一个很小的问题....明明加了legend(),图表会出来,却无法正常显示图例.最后发现只要在plt.plot()加label图例就可以正常显示了.

  3. matplotlib中的legend()—显示图例

    源自  matplotlib中的legend()——用于显示图例 -- 博客园 http://www.cnblogs.com/yinheyi/p/6792120.html legend()的一个用法: ...

  4. echarts彩虹柱状图 每个bar显示不同颜色, 标题在不同位置 ,工具中有可以直接保存为图片下载,平均线的添加

    可以参考: https://echarts.baidu.com/echarts2/doc/example.html https://echarts.baidu.com/echarts2/doc/doc ...

  5. echarts之字符云tooltip显示混乱问题的解决办法

    echarts字符云中tooltip显示混乱主要表现为一下两点: 1.字体与其显示框内容不对应鼠标识别错误 解决思路: 就是option里的数据要对value降序排序(这一点很关键,是必须的一步) 把 ...

  6. Echarts 南海诸岛简图显示位置调整

        最近需要echart同时显示海南岛和南海诸岛,开始想寻找南海诸岛的数据,经过查找,这种简图数据是没有的(china.js地图数据一一找过了),下图是echarts的一些示例,没有满足我们的要求 ...

  7. Echarts饼图更改颜色、显示数据且换行

    var option = {   title : {       text: '数据来源',       x:'center'   },   tooltip : {       trigger: 'i ...

  8. matplotlib中的legend()——用于显示图例

    legend()的一个用法: 当我们有多个 axes时,我们如何把它们的图例放在一起呢?? 我们可以这么做: import matplotlib.pyplot as plt import numpy ...

  9. Echarts 的悬浮框tooltip显示自定义格式化

    最近做的项目用到echarts雷达图,但是由于地市过多,遇到悬浮框显示问题被遮住 如图: 可以看到上面从兴安开始数据就被遮住了 为了解决这个被遮住的悬浮框,达到tooltip自定义格式 完成后的效果如 ...

随机推荐

  1. sql charIndex用法

    CHARINDEX(): 写SQL语句我们经常需要判断一个字符串中是否包含另一个字符串,但是SQL SERVER中并没有像C#提供了Contains函数,不过SQL SERVER中提供了一个叫CHAE ...

  2. Nginx反向代理与负载简单实现

    反向代理 1.proxy_pass 通过反向代理把请求转发到百度 2.proxy_pass 既可以是ip地址,也可以是域名,同时还可以指定端口 3.proxy_pass 指定的地址携带了URI,如果前 ...

  3. 显示point data的时均值注意事项

    正确的导入顺序应该是: 先导入cell data,再做时均处理,最后再转换成point data.如果先转换成point data再做时均处理,速度会非常慢.

  4. Python学习 day13

    一.可迭代对象和迭代器 1.回顾可以被for循环的对象 list.dic.str.set.tuple.文件句柄f.range().enumerate() 只有可迭代对象才能被for循环,当我们遇到一个 ...

  5. linux vi文本编辑器三种模式切换及常用操作

    初学者刚进入vi不要乱点键盘,vi的三种模式和各种命令很容易弄混@@ vi编辑器是Unix系统最初的编辑器.它使用控制台图形模式来模拟文本编辑窗口,允许查看文件中的行.在文件中移动.插入.编辑和替换文 ...

  6. 3dsmax2018卸载/安装失败/如何彻底卸载清除干净3dsmax2018注册表和文件的方法

    3dsmax2018提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dsmax2018失败提示3dsmax2018安装未完成,某些产品无法安装,也有时候想重新 ...

  7. selenium自动化测试用例需要关注的几点(二)

    注:原文地址 UI映射 一个UI映射是一种机制,它存储所有的定位器的测试套件在一个地方,方便修改UI元素的路径标识符或改变在AUT.测试脚本,然后使用UI地图定位以被测试的元件.基本上,UI地图是一个 ...

  8. 如何在cmd窗口里快速且正确打开任意位置路径(各版本windows系统都适合)(图文详解)(博主推荐)

    问题的由来 有时候,我们很苦恼,总是先系统键 + R,然后再去手动敲.尤其对win7系统比较麻烦 解决办法 方法一:复制路径(这点对win10系统做得好,直接可以复制) ,win7系统的话可能还需要设 ...

  9. 记一次idea性能调优

    因自研的自动化测试工具包含压测功能,在自己本地代码开发完毕后进行测试,对目标接口进行1000次访问,发现idea在执行结束后变的异常卡顿,怀疑是idea工具或者程序代码存在问题,遂进行排查. ---- ...

  10. 关于myeclipse加载building workspace卡顿的解决办法

    在MyEclipse的使用中,在建立新文件或者改动代码后,经常会出现building workspace半天卡顿不动的情况,如果开的程序过多,经常会发生失去响应,电脑要是再烂点,直接死机的情况也常有发 ...