echart表格,动态的通过ajax从后台获取数据动态的展示数据
官网上都是介绍的echar表格的展示方法,但是都是静态数据,一开始的时候我总是纳闷,这些数据都是怎么上上去的 ,
后来通过一些方法,当然这些方法也不是我自己写出来的,也是通过在网上收集了一下 ,现在才明白,具体是怎么样
把这些数据放上去的。


function myData(text) {
var xA = [];
var yA = [];
for(var i = 0;i<text.data.length;i++) {
xA.push(text.data[i].MovieName);
yA.push(text.data[i].BoxOffice);
}
var myChart = echart.init(document.getElementById("res"));
var option = {
title: {
text:"实时票房"
},
tooltip: {},
legend: {
data:["金额/万元"]
},
grid: {
y2:140
},
xAxis: {
data:xA,
axisLable: {
interval: 0,
rotate: -25
}
},
yAxis: {},
series: [{
name:"金额/万元",
type:"bar",
data: yA
}]
};
myChart.setOption(option);
}
function myJson() {
$.ajax({
type:"get",
url:"http://api.shenjian.in/",
data: {
appid: "dd6481kkkk"
},
dataType: "jsonp",
success: function(data) {
myData(data)
}
})
}
//执行函数
myJson();
echart表格,动态的通过ajax从后台获取数据动态的展示数据的更多相关文章
- jquery通过AJAX从后台获取信息并显示在表格上的类
前一阵我写了:<jquery通过AJAX从后台获取信息并显示在表格上,并支持行选中.>现在,我把他们处理了一下,不需要每次写代码了: 具体代码如下: //获取数据并显示数据表格 funct ...
- jquery通过AJAX从后台获取信息并显示在表格上,并支持行选中
不想用Easyui的样式,但是想要他的表格功能,本来一开始是要到网上找相关插件的,但是没找到就开始自己写,没想到这么简单. 后台代码:(这个不重要) public ActionResult GetDi ...
- java后台获取和js拼接展示信息
java后台获取和js拼接展示信息: html页面代码: <div class="results-bd"> <table id="activityInf ...
- jsTree通过AJAX从后台获取数据
页面代码: <div id="MenuTree"></div> javascript代码: $(document).ready(function ($) { ...
- django后台获取相同name名的数据
django后台获取相同name名的post数据html: <form method="post"> <input type="text" n ...
- Jquery通过AJAX从后台获取数据显示在表格上(复选)
代码: function GetMultiLineSelectTable(tableId, selectIds) { var table = $(tableId); var url = table.d ...
- c# ajax从后台获取数据list数组 $.each再显示数据
后台代码 public JsonResult linkage(string Department) {//逻辑是:先从数据库查到表数据 再把表数据转换为LIST给AJAX HE_Department ...
- jQuery ajax参数后台获取不到的问题
<script type="text/javascript"> init(); var alldate = {a : "0",b:"1&q ...
- 使用axios post 提交数据,后台获取不到提交的数据解决方案
一.问题发现 前后端分离使用vue开发,结合axios进行前后端交互数据,一开始使用 get 请求,获取数据,没有发现任何问题,当使用 post请求 传参时,发现,数据明明已经提交,在打开F12 开发 ...
随机推荐
- POJ 1330 Nearest Common Ancestors 【最近公共祖先LCA算法+Tarjan离线算法】
Nearest Common Ancestors Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 20715 Accept ...
- C# 关于线程锁lock的使用方法
C# 关于线程锁lock的使用方法 原创 2016年09月02日 10:07:05 标签: c# / 线程 / 锁 / lock 11937 在多线程编程中,可能会有许多线程并发的执行一段代码(代码块 ...
- latex 技巧汇总
最近打算详细的学习一下latex,所以在学习的过程中遇到了一些问题.随时出问题,随时记录更新. 我是萌萌的Latex, x_0. 再写具体的技巧之前,先说一个关于打公式的小技巧.有时候你不知道怎么设置 ...
- python根据圆的参数方程求圆上任意一点的坐标
from math import cos, sin,pi x0,y0=0,0 r=4.0 angle=-25 x1 = x0 + r * cos(angle * pi / 180) y1 = y0 + ...
- html5 canvas画饼
1. [图片] lxdpie.jpg 2. [文件] lqdpie.html ~ 801B 下载(7) <!DOCTYPE HTML PUBLIC "-//W3C//DTD ...
- 使用谷歌浏览器进行Web开发技巧
1.为了避免缓存影响开发,使用使用那个“Ctrl+Shift+N”进入浏览器的隐身模式
- springmvc的简单介绍以及springmvc组件的介绍
Spring web mvc框架 什么是springmvc Springmvc是spring框架的一个模块,spring和springmvc无需中间整合层整合 Springmvc是一个基于mvc的we ...
- Unity-2017.2官方实例教程Roll-a-ball(一)
声明: 本文系转载,由于Unity版本不同,文中有一些小的改动,原文地址:http://www.jianshu.com/p/6e4b0435e30e Unity-2017.2官方实例教程Roll-a- ...
- AtCoder AGC #3 Virtual Participation
Havana真好听qwq AB题就不写了 SB C.BBuBBBlesort! 有一个长度为$n$的数列 你每次可以用两种操作 1.交换两个相邻元素 2.交换两个隔且仅隔了一个的元素 求把数列排成有序 ...
- linux——boot空间不足
1. 先用df命令,查看磁盘分区情况 2. dpkg --get-selections|grep linux-image(查看更新了多少内核) root@ubuntu:/home/hadoop# dp ...