代码如下:

// 基于准备好的dom,初始化echarts图表
var myChart = echarts.init(document.getElementById("main"));
//异步获取数据
var cate=[];
var da=[];
function getsomething(i){
var cate=[];
var da=[];
var id= i.value;
var option=$("#year option:selected").val();
$.get('getsj',{id:id,option:option},function(data){
var b=JSON.parse(data);
for(var i=0;i< b.length;i++){
cate.push(b[i].days);
da.push(b[i].sums);
}
myChart.setOption({ //加载数据图表
title: {
text: '车场收益折线图'
},
tooltip: {},
legend: {
data:['收入']
},
xAxis: {
data: cate
},
yAxis: {},
series: [{
name: '收入',
type: 'line',
data: da
}]
});
})
}
在测试过程中,将 myChart.setOption() 加载数据图表放在方法外导致无法实例出图表,要注意。

---恢复内容结束---

使用echart 做出数据折线图的更多相关文章

  1. Echarts使用及动态加载图表数据 折线图X轴数据动态加载

    Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...

  2. Echart饼形图和折线图的循环展示及选择展示

    需求:根据不同的入参调同一接口,循环展示一组饼形图或折线图: 主要问题:在于给定的数据格式不符合图表的配置项格式,需要拆分组装数据:首先默认展示几个图表,当选中一个类别,需要展示其中一个的时候,页面中 ...

  3. react-echarts之折线图的显示

    react中想要实现折线图和饼图的功能,需要引入react-echarts包,然后再实现折线图的功能.我这里引用的版本是:0.1.1.其他的写法参echarts官网即可.下面详细讲解的是我在react ...

  4. ECharts折线图多个折线每次只显示一条

    echart 两条折线图如何默认只显示一条,另一条隐藏呢 只需要在legend后加上, selectedMode: 'single', selectedMode [ default: true ] 图 ...

  5. 图表echarts折线图,柱状图,饼状图

    总体就是有折线图相关图标的设置,x,y轴的设置,x,y轴或者数据加上单位的设置.饼状图如何默认显示几个数据中的某个数据 折线图:legend(小标题)中间默认是圆圈 改变成直线 在legend设置的时 ...

  6. Android 使用 MPAndroidChart 实现折线图

    Android 使用 MPAndroidChart 实现折线图 做Android项目的时候用到了折线图,不光折线图,还可能遇到很多的图表需要展示渲染,自己手画的话那好玩了,今天使用MPAndroidC ...

  7. 数据可视化(Echart) :柱状图、折线图、饼图等六种基本图表的特点及适用场合

    数据可视化(Echart) 柱状图.折线图.饼图等六种基本图表的特点及适用场合 参考网址 效果图 源码 <!DOCTYPE html> <html> <head> ...

  8. MVC中使用Echart后台加载数据 实现饼图、折线图、全国地图数据,单击双击事件等

    @{ Layout = null; } @if (false) { <script src="~/Js/jquery-easyui-1.5/jquery.min.js"> ...

  9. echart折线图,柱状图,饼图设置颜色

    转载: 之前在做报表的时候用过echart 用完也就完了,而这次在用的时候已经忘了,所以这里简单记录一下,好记性不如烂笔头!!! 1.折线图修改颜色: xAxis: { type: 'category ...

随机推荐

  1. idea自个常用工具的总结

    1.直接打开某类:ctrl+shift+t2.注释某类:ctrl+?3. implementation :Ctrl+T4.rename:Alt +Shirft +R5.Show Intention A ...

  2. #!/usr/bin/python3 和 #!/usr/bin/env python3的区别

    脚本语言的第一行指出用什么程序去执行代码. #!/usr/bin/python3调用/usr/bin下的python3解释器.#!/usr/bin/env python3首先会到env设置里查找pyt ...

  3. 15_Raid及mdadm命令 _LVM

    磁盘管理:     机械式硬盘:     U盘,光盘,软盘,硬件,磁带 ln [ -s -v ] SRC DEST 硬链接:     1.只能对文件创建,不能应用于目录     2.不能跨文件系统   ...

  4. 【Git】【环境搭建】

    Mac下GitHub安装及使用教程: https://blog.csdn.net/u012460084/article/details/45830911

  5. Windows 循环根据进程名称 存在则删除该进程

    @echo off:Looptasklist | findstr /i "javaw.exe" >nul 2>nul && (taskkill -f / ...

  6. Oracle创建表、修改字段类型

    1.创建表 1.创建表 create table SCM_PER( --SCM_PER表名 ID ) primary key,--主键ID USERID ),--用户ID --Permission v ...

  7. python2.7安装

    下载地址:https://www.python.org/downloads/release/python-2716/ 尽量使用VPN,不然会很慢 安装后需要配置环境变量

  8. 文献导读 | Single-Cell Sequencing of iPSC-Dopamine Neurons Reconstructs Disease Progression and Identifies HDAC4 as a Regulator of Parkinson Cell Phenotypes

    文献编号:19Mar - 11 2019年04月23日三读,会其精髓: 相信这种方法的话,那么它的精髓是什么,如何整合出这个core gene set. 首先要考虑样本的选择,样本里是否存在明显的分层 ...

  9. Log4Net 常见格式说明(不断更新中)

    用户名  %username pc版本 另起一行 %newline

  10. Matlab内嵌图像

    在数值分析中我们通常需要将数据可视化成图像的形式作为我们分析结果的有效性的途径,常用的画图函数有:$\tt plot$,$\tt surf$,$\tt mesh$...当然,我们有时需要多窗口显示图像 ...