<script type="text/javascript">
var myChart;
myChart = echarts.init(document.getElementById('main')); var legendDate="";
var series="";
var ser="";
var legend="";
var option={};
$.ajax({
type: "post",
async: false, //同步执行
url: "task/result_charts",
dataType: "json", //返回数据形式为json
success: function (result) {
legendDate = ["2014","2015","2016"];
series = [ { "name":"2014", "type":"bar", "data":[51, 2, 43],"len":"中国"} ,{ "name":"2015", "type":"bar", "data":[55, 36, 4] ,"len":"美国"},{ "name":"2016", "type":"bar", "data":[5, 20, 40],"len":"英国"}];
legend = ["中国","美国","德国"];
optionSeries();
for(i=0;series.length>i;i++){
option.series[i]=series[i];
}
},
error: function (errorMsg) {
}
}); function optionSeries(){ option = {
title: {
text: '性能数据采集入库效率趋势图'
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
legend: {
data: legendDate
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: {
type: 'value',
boundaryGap: [0, 0.01]
},
yAxis: {
type: 'category',
data: legend
},
series: [ ]
};
} //通过Ajax获取数据 myChart.setOption(option);
</script>

Echarts - js的更多相关文章

  1. echarts3 -arcgis echarts.js修改

     在echarts.js中修改修改 clone 方法    其中 source instance of Array 修改为Object.prototype.toString.call(source)  ...

  2. 前端数据可视化echarts.js使用指南

    一.开篇 首先这里要感谢一下我的公司,因为公司需求上面的新颖(奇葩)的需求,让我有幸可以学习到一些好玩有趣的前端技术,前端技术中好玩而且比较实用的我想应该要数前端的数据可视化这一方面,目前市面上的数据 ...

  3. echarts.js 做图表的插件

    <scripttype="text/javascript"src="{uiurl()}echarts/echarts.js"></script ...

  4. echarts.js(图表插件)2.0版会导致 ZeroClipboard.js(复制插件)失效,3.0版未知。

    解决方法:ZeroClipboard.js先于echarts.js加载.

  5. 图表工具--- ECharts.js学习(一) 简单入门

    ECharts.js学习(一) 在项目开发的时候,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库.具体有哪几种可以看: 前端开发者常用的9个JavaScript图表库 EChar ...

  6. 关于echarts.js 柱形图

    echarts.js官网: http://www.echartsjs.com/index.html 这是我所见整理最详细echarts.js 柱形图博客: https://blog.csdn.net/ ...

  7. 前端数据可视化echarts.js

    一.echarts.js的优势与总体情况 echarts.js作为国内的IT三巨头之一的百度的推出一款相对较为成功的开源项目,总体上来说有这样的一些优点 1.容易使用 echarts.js的官方文档比 ...

  8. ECharts.js学习(一) 简单入门

    EChart.js 简单入门 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart   这个是Visual Studio里的自带控件,使用比 ...

  9. ECharts JS应用:图表页面实现

    因为要统计数据进行图表展示,所以就简单学习了 ECharts JS 的应用.它是一个纯Javascript图库,它依赖于一个轻量级的Canvas库 ZRender,并提供直观.生动.交互式和高度可定制 ...

  10. echarts.js应用之map

    最近项目中用到了echarts.js中的map,我画了一个简版的案例,如下所示: 效果图: 主要代码如下: <!DOCTYPE html> <html lang="en&q ...

随机推荐

  1. Excel下用SQL语句实现AVEDEV函数功能

    Excel下AVEDEV函数返回一组数据点到其算术平均值的绝对偏差的平均值. AVEDEV 是对一组数据中变化性的度量.最常见的应用就是统计平均分差. 但是如果在Excel中写SQL进行一些复杂的统计 ...

  2. source insight 完全卸载和重装

    Source insight的卸载不干净,会影响之后的安装 切入正题,完美卸载source insight的方法: 一.在pc的控制面板—>程序—>卸载程序 找到source insigh ...

  3. android手机配置hosts文件

    Android设备测试服务器时,可能需要修改 hosts 文件指定域名到对应的 IP 地址.Android 是基于 Linux 的系统,与 Linux 类似,通过 hosts 文件来设置. 在 And ...

  4. 【BZOJ】【3504】【CQOI2014】危桥

    网络流/最大流 比较裸的最大流= = 无向图上走来回其实就等价与走两遍>_> 如果路径有相交其实不影响答案的 比较恶心的是两个人路过同一座桥,但走的方向不同互相抵消流量了…… 其实只要在第 ...

  5. VS Bug 当获取其他项目的代码时, F5 无法进入调试模式. 也不报错....

    在64位的机子下, 被获用的项目使用X86时会出现. 就会出现   F5 无法进入调试模式. 也不报错.... 打断点也没有用. 在不加入X86项目的代码时, 又可以运行..   解决方案:   检查 ...

  6. 大话C#之属性

    前言 俗话说得好:工欲善其事,必先利其器.要想玩转OOP设计出一个优秀的类型,属性是必不可少的,那么我们今天就来说说c#中关于属性的二三事. 属性(property)分为无参属性(parameterl ...

  7. (转)排列算法 Permutation Generation

    转自:http://www.cnblogs.com/dragonpig/archive/2010/01/21/1653680.html http://www.notesandreviews.com/p ...

  8. POJ 2533 Longest Ordered Subsequence

    题目描述:LIS(Longest Increasing Subsequence)模板题 分析:O(n^2)的方法 状态表示:d[i]表示以i结尾的最长上升子序列长度 转移方程:d[i]=max{ 1, ...

  9. 历代诗词咏宁夏注释2_----苍岩道人<登文昌阁>

    登文昌阁[1] 苍岩道人 壮年碌碌走尘埃,此地清幽不肯来. 老去始惊春梦促,韶光易过槿花开.[2] 历朝兴废书千卷,万古忠奸土一堆.[3] 惟爱莎罗歌最好,闲时拍板满斟杯.[4] 注释 [说明]选自& ...

  10. Android中的SQLite使用学习

    Android中的SQLite使用学习 SQLite是非常流行的嵌入式关系型数据库,轻载, 速度快,而且是开源.在Android中,runtime提供SQLite,所以我们可以使用SQLite,而且是 ...