前言:
大家都知道,一般情况下,想要使用前端设置一个 柱状图 需要使用 canvas 画布进行编写,不仅代码多,逻辑处理麻烦,今天交大家使用一个插件,使用它就可以轻松的做出各种图。
今天先和大家说一下如何引入 Echarts 插件,和柱状图需要如何使用,代码如何进行编写
什么是 Echarts 插件
echars是一棵树
这个图标是简单还是复杂,取决你在这棵树上绘制的枝干有多少
树就是dom容器,初始化,挂载到dom容器上,把枝干在配置进来
枝干可以在示例中,具体代码里有配置,在文档中查看具体效果
柱状图成品展示

步骤:
-
- 首先下载 Echarts 插件,下载需要的版本即可,我这里使用的是 4.9.0 版本(最新版的一般都有一些 BUG)
cnpm install echarts@4.9.0 --save
-
- 引入 Echarts 插件(在vue中一般都是引入到main.js组件中)
import echarts from 'echarts'
// 挂载到vue原型中就可以全局使用
Vu

本文介绍了如何借助Echarts插件在前端快速生成柱状图,避免了使用canvas手动绘制的复杂过程。首先解释了Echarts的本质,然后展示了柱状图的成品效果,并详细说明了从下载插件到在Vue项目中引入并编写柱状图代码的步骤。

3767

被折叠的 条评论
为什么被折叠?



