Vue2.0+elementUI使用echarts插件
<template>
<div id="chartColumn" style="width: 100%; height: 400px;">
</div>
</template>
3. js代码:
<script>
import echarts from 'echarts'
export default {
data(){
return {
chartColumn: null
}
},
mounted() {
this.drawLine();
},
methods: {
drawLine(){
this.chartColumn = echarts.init(document.getElementById('chartColumn')); this.chartColumn.setOption({
title: { text: 'Column Chart' },
tooltip: {},
xAxis: {
type: 'category',
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
},
yAxis: {
type: 'value'
},
series: [{
data: [820, 932, 901, 934, 1290, 1330, 1320],
type: 'line'
}]
});
}
}
}
</script>
4、效果图:
Vue2.0+elementUI使用echarts插件的更多相关文章
- Vue2.0 + ElementUI 手写权限管理系统后台模板(一)——简述
挤一下: 一开始以为没有多少人用就没建群,但是加我的人太多了,好多问题都是重复的,所以建个群大家互相沟通交流方便点,但是建的有点晚,错过了好多人所以群里人有点少,QQ群: 157216616 小提示 ...
- Vue2.0+ElementUI+PageHelper实现的表格分页
Vue2.0+ElementUI+PageHelper实现的表格分页 前言 最近做了一些前端的项目,要对表格进行一些分页显示.表格分页的方法有很多,从宏观上来说分为物理分页和逻辑分页,由于逻辑分页(即 ...
- Vue2.0 + Element-UI + WebAPI实践:简易个人记账系统
最近正在学习Vue2.0相关知识,正好近期饿了么桌面端组件Element-UI发布,便动手做了一款简易个人记账系统,以达到实践及巩固目的. 1.开发环境 Win10 + VS2015 + Sqlser ...
- vue2.0+elementUI构建单页面后台管理平台
git:https://github.com/reg21st/vue2-management-platform 访问:https://reg21st.github.io/vue2-management ...
- vue2.0实现倒计时的插件(时间戳 刷新 跳转 都不影响)
我发现好多倒计时的插件,刷新都会变成从头再来,于是自己用vue2.0写了一个,测试通过,直接上代码 如下是组件代码: <template> <span :endTime=" ...
- vue2.0+element-ui(01简单点的单页面)
前言: 在<Vue.js权威指南>刚出版的时候,自己就作为一名前端粉捧了一把场,可是真是应了那句“出来混,总是要还的“这句话了,那时候信心满满的买来书想要认真研究,最终却还是把它搁浅了.直 ...
- Vue实例:vue2.0+ElementUI框架开发pc项目
开发前准备 vue.js2.0中文,项目所使用的js框架 vue-router,vue.js配套路由 vuex,状态管理 Element,UI框架 1,根据官方指引,构建项目框架 安装vue npm ...
- vue2.0+Element-ui实战案例
前言 我们将会选择使用一些 vue 周边的库vue-cli, vue-router,axios,moment,Element-ui搭建一个前端项目案例,后端数据接口,会使用json-server快速搭 ...
- vue2.0 element-ui中el-upload的before-upload方法返回false时submit()不生效解决方法
我要实现的功能是在上传文件之前校验是否表格中存在重复的数据,有的话,需要弹窗提示是否覆盖,确认之后继续上传,取消之后,就不再上传. 项目中用的element-ui是V1.4.3 <el-uplo ...
随机推荐
- ELK 二进制安装并收集nginx日志
对于日志来说,最常见的需求就是收集.存储.查询.展示,开源社区正好有相对应的开源项目:logstash(收集).elasticsearch(存储+搜索).kibana(展示),我们将这三个组合起来的技 ...
- ISO/IEC 9899:2011 条款6.4.1——关键字
6.4.1 关键字 语法 1.以下为关键字: auto break case char const continue default do double ...
- DisplayAttribute应用——根据PropertyName自动获取对应的UI显示名
model定义,使用DisplayAttribute public class AddressSetInfo { /// <summary> /// invoiceAddress.Id / ...
- 请求头User-Agent作用?
请求头User-Agent作用 答: User Agent中文名为用户代理,是Http协议中的一部分,属于头域的组成部分,User Agent也简称UA.它是一个特殊字符串头,是一种向访问网站提供你所 ...
- (十三)过滤器Filter(转)
--------转自孤傲苍狼博客 一.Filter简介 Filter也称之为过滤器,它是Servlet技术中最激动人心的技术,WEB开发人员通过Filter技术,对web服务器管理的所有web资源:例 ...
- Jenkins备份插件backup
这个插件可以备份Jenkins的JENKINS_HOME目录,并恢复,但是版本太旧了. 有一些其他插件可以定时备份,搜索Backup https://www.cnblogs.com/cxwblog/p ...
- 【WPS单元格】汉字转拼音的方法
昨晚休息的时候,赵 sir发来消息,突然有急事,需要把大批量的单元格汉字名字转换为拼音.迅粗略搜了下百度,发现office Excel 是很方便的,而赵 sir电脑装的是wps.百度了下,发现关于WP ...
- ubuntu 12.04 下LVS的一些搭建心得和资料整理
最近项目上需要使用到IPVS进行负载均衡,针对外部传来的HTTP请求,分摊到多台服务器上进行处理,所以看了一下这方面的资料,在这里纪录一下. Lvs是基于IP层和内容分发请求的负载均衡方法(所以也可以 ...
- Mac brew命令踩坑
brew是mac上的在线包管理软件,相当于linux apt以及yum包管理工具 1.取消brew的自动更新(https://blog.csdn.net/yf9595/article/details/ ...
- Rhino脚本引擎技术介绍
引用:http://p.primeton.com/articles/54c1e255be20aa4735000001 http://blog.csdn.net/u013292493/article/d ...