今天我要给 echarts 组件加个 dataZoom 功能,结果发现没有效果。

后来发现是引入 echarts 模块的问题。

如果是按需引入的话,必须引入相应的功能模块才能使用相应的功能。

举例:

import echarts from 'echarts/lib/echarts'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/legend'
import 'echarts/lib/component/title'

我没有引入 dataZoom ,所以不能使用。

import echarts from 'echarts/lib/echarts'
import 'echarts/lib/chart/bar'
import 'echarts/lib/component/tooltip'
import 'echarts/lib/component/legend'
import 'echarts/lib/component/title'
import 'echarts/lib/component/dataZoom'

这样就可以了。

echarts 踩坑 : 为什么效果出不来?看看有没有正确引入的更多相关文章

  1. echarts踩坑---容器高度自适应

    在echarts中,若设置固定高度,当柱状图数据过多时会出现数据相互挤压,给用户的体验十分糟糕,可以通过给容器设置自适应高度,然后通过getDom()的方法解决此问题. 具体解决办法如下: <d ...

  2. echarts 踩坑 : id必须不同

    我们可能用react前端框架开发项目. 也就是组件化开发. 一个页面里可能有很多组件. 而echarts是寻找特定ID的DOM去渲染的. 也就是说,如果整个页面.包括所有页面组件,有id相同的DOM, ...

  3. echarts踩坑总结

    1,有关echarts引用的相关报错直接写这句  import * as echarts from 'echarts' 2,折线图 chartsObj = { tooltip: { trigger: ...

  4. echarts 踩坑 : 为什么触摸柱状图的时后柱子不见了?原来是color的锅!

    今天发现一个奇怪的问题. 当我的鼠标触摸柱状图的时候,柱状图就消失了. 后来发现是颜色的设置有问题. color: ['rgba(68,238,224)', 'rgba(17,215,255)', ' ...

  5. ant.design React使用Echarts,实力踩坑

    最近项目用到Echarts(以下用ec代替),于是照猫画虎得引入到团队的antd项目中,但是遇到2个棘手问题: 1. ec对dom不渲染,检查后发现,原来是全局存在id重复,所以使用React时,最好 ...

  6. vue父组件异步传递prop到子组件echarts画图问题踩坑总结

    效果图: 大致思路:考虑到5张图都是折线图,所以准备用一个子组件承接echarts画图,然后父组件通过prop传递不同数据来展示不同的图 踩坑问题: 1.引入line子组件,画了5个元素,但是只显示一 ...

  7. 微信小程序之mpvue+iview踩坑之旅

    因为之前参照微信的原生的文档写过一些小程序的demo,写的过程比较繁琐,后来出了美团的mpvue,可以直接使用vue开发,其他的不作对比,这篇文章记录一下踩坑之旅. 参照mpvue http://mp ...

  8. JavaScript 踩坑心得— 为了高速(下)

    一.前言 本文的上一篇 JavaScript 踩坑心得- 为了高速(上) 主要和大家分享的是 JavaScript 使用过程中的基本原则以及编写过程中的心得分享,本文主要和大家聊聊在各个使用场景下的 ...

  9. Spark踩坑记——从RDD看集群调度

    [TOC] 前言 在Spark的使用中,性能的调优配置过程中,查阅了很多资料,之前自己总结过两篇小博文Spark踩坑记--初试和Spark踩坑记--数据库(Hbase+Mysql),第一篇概况的归纳了 ...

随机推荐

  1. Spring插件安装 - Eclipse 安装 Spring 插件详解(Spring Tool Suite)

    安装完成后重启eclipse即可新建spring工程

  2. Java前端面试题总结

    Java前端面试题总结 简单说一下HTML,CSS,javaScript在网页开发中的定位? HTML:超文本标记语言,定义网页的结构 CSS:层叠样式表,用来美化页面 JavaScript:主要用来 ...

  3. 为Promise添加finally方法支持,把小程序函数变成promise函数

    // 为Promise添加finally方法支持 Promise.prototype.finally = function (callback) {   let P = this.constructo ...

  4. git常用代码合集

    git常用代码合集 1. Git init:初始化一个仓库 2. Git add 文件名称:添加文件到Git暂存区 3. Git commit -m “message”:将Git暂存区的代码提交到Gi ...

  5. 使用Jmeter如何测试下载接口

    性能测试过程中,有时候需要对下载类的功能做压测,有些同学没有这方面的测试经验,比较迷茫,本文简单介绍下如何测试下载类的请求1.首先使用fiddler抓包,知道是一个http类型的请求,有一个post请 ...

  6. 谁再悄咪咪的吃掉异常,我上去就是一 JIO

    又到周末了,周更选手申请出站~ 这次分享一下上个月碰到的离奇的问题.一个简单的问题,硬是因为异常被悄咪咪吃掉,过关难度直线提升,导致小黑哥排查一个晚上. 这个美好的晚上,本想着开两把 LOL 无限火力 ...

  7. gatewayworker 安装 pcntl 扩展

    安装其它扩展也是如此. 第一步,查看php版本: /phpstudy/server/php/bin/php -v 第二步,下载扩展文件: http://php.net/releases/  这里面寻找 ...

  8. SpringCloud gateway 3

    参考博客:https://www.cnblogs.com/crazymakercircle/p/11704077.html 1.1 SpringCloud Gateway 简介 SpringCloud ...

  9. Mariadb之显式使用表锁和行级锁

    首先我们来看看mariadb的锁定概念,所谓锁就是当一个进程或事务在操作某一资源时,为了防止其他用户或者进程或事务对其进行资源操作,导致资源抢占而发生冲突,通常在A进程操作该资源时,会对该资源进行加锁 ...

  10. 入门大数据---Hive视图和索引

    一.视图 1.1 简介 Hive 中的视图和 RDBMS 中视图的概念一致,都是一组数据的逻辑表示,本质上就是一条 SELECT 语句的结果集.视图是纯粹的逻辑对象,没有关联的存储 (Hive 3.0 ...