echarts_02
1. 如果数据加载时间较长,一个空的坐标轴放在画布上也会让用户觉得是不是产生 bug 了,因此需要一个 loading 的动画来提示用户数据正在加载。
ECharts 默认有提供了一个简单的加载动画。只需要调用 showLoading 方法显示。数据加载完成后再调用 hideLoading 方法隐藏加载动画。
myChart.showLoading();
$.get('data.json').done(function (data) {
myChart.hideLoading();
myChart.setOption(...);
});
2.echarts图表导出excel示例
http://www.jb51.net/article/49343.htm
3.配置echarts工具栏,保存图片
http://www.cnblogs.com/heganlin/p/5764040.html
http://echarts.baidu.com/option.html#toolbox.feature.saveAsImage.icon
function echarts_test (id, x_data, y_item)
{
// 基于准备好的dom,初始化echarts图表
var myChart = echarts.init(document.getElementById(id));
var option = {
title:{
text:'title_name',
show:false,
},
tooltip: {
show: true
},
legend: {
data:['功率/dB']
},
toolbox: {
show: true,
feature: {
magicType: {
type: ['stack', 'tiled']
},
dataView: {show:true},
saveAsImage: {
show:true,
excludeComponents :['toolbox'],
pixelRatio: 2 }
}
},
xAxis : [
{
type : 'category',
data : x_data,
}
],
yAxis : [
{
type : 'value'
}
],
series : [
{
"name":"功率/dB",
"type":"bar",
"data": y_item,
}
],
dataZoom: [
{
type: 'slider',
xAxisIndex: 0,
start: 10,
end: 60
},
{
type: 'inside',
xAxisIndex: 0,
start: 10,
end: 60
},
{
type: 'slider',
yAxisIndex: 0,
start: 30,
end: 80
},
{
type: 'inside',
yAxisIndex: 0,
start: 30,
end: 80
}
], };
//myChart.showLoading();
// 为echarts对象加载数据
myChart.setOption(option);
}
echarts_02的更多相关文章
随机推荐
- C# 枚举转集合
记录一下,方便自己下次使用. public class EnumHelper { /// <summary> /// 将枚举转为集合 /// </summary> /// &l ...
- JSP和JSTL视图解析器
使用JSTL users.jsp <%@ page language="java" contentType="text/html; charset=UTF-8&qu ...
- O018、理解 Keystone 核心概念
参考https://www.cnblogs.com/CloudMan6/p/5365474.html 作为OpenStack的基础支持服务,Keystone做了下面几件事情: 1.管理 ...
- O002、虚拟化
参考https://www.cnblogs.com/CloudMan6/p/5233484.html OpenStack 是云操作系统,要学习 OpenStack,首先需要掌握一些虚拟化和云计算的 ...
- luogu P4437 [HNOI/AHOI2018]排列
luogu 问题本质是把\(a_i\)作为\(i\)的父亲,然后如果有环就不合法,否则每次要取数,要满足取之前他的父亲都被取过(父亲为0可以直接取),求最大价值 贪心想法显然是要把权值大的尽量放在后面 ...
- poj 2081 Recaman's Sequence (dp)
Recaman's Sequence Time Limit: 3000MS Memory Limit: 60000K Total Submissions: 22566 Accepted: 96 ...
- 【有钱的大佬看过来】Java开发学习大纲
Java开发学习大纲文档V7.0 有钱的大佬可以买下这个版权,全网最完整最详细了,没钱的大佬可以按照自己的方式去整理.有需要的私聊作者QQ:253173641 来源于-幸福的沉淀:https://ww ...
- Vivado添加sublime text编辑器
我们当用vivado会发现文本编辑器有点鸡肋,没有自动的缩进的功能,所以我想用sublime来进行文本的编辑,下面就是绑定的一些方法(但是呢其实吧,虽然可以绑定却不能实时的报错,,,我感觉我还是老老实 ...
- 牛客练习赛26 E-树上路径 (树链剖分+线段树)
链接:https://ac.nowcoder.com/acm/contest/180/E 来源:牛客网 树上路径 时间限制:C/C++ 2秒,其他语言4秒 空间限制:C/C++ 262144K,其他语 ...
- mysql安装及加固
mysql安装 查看是否安装mysql 我们先看一下有没有安装mysql yum list installed mysql | grep mysql 本地只安装了php链接mysql的库,没有安装my ...