<div id="container" style="height: 400px"></div>
<script type="text/javascript" src="<!--{$skinUrl}-->js/jquery.min.js"></script>
<script type="text/javascript" src="<!--{$skinUrl}-->js/echarts.common.min.js"></script>

function initData(type,num) {
$.post('report.ajaxload.html',{type:type,num:num}, function(data){
var tbhtml = "";
var listLth=data.list.length;
for(var i=0; i<listLth;i++){
tbhtml += '<tr><td>'+data.list[i].payDate+'</td>';
tbhtml += '<td>'+data.list[i].num+'</td>';
tbhtml += '<td>'+data.list[i].payamount+'</td></tr>';
}
$("#tbody").html(tbhtml);

var detail= data.report;
hightChartsfn(detail,num);
}, 'json');
}
var data='<!--{$data.report}-->';
data = JSON.parse(data);
hightChartsfn(data,0);
function hightChartsfn(data,num) {
var dom = document.getElementById("container");
var myChart = echarts.init(dom);
var title = data.title;
var detail = data.detail;
var end = 100;
if(num>0){
end = 50;
}
option = null;
option = {
backgroundColor:'#fff',
xAxis: {
type: 'category',
boundaryGap: false,
data: title
},
tooltip: {
trigger: 'axis'
},
yAxis: {
type: 'value'
},
dataZoom: [
{
show: true,
realtime: true,
start: 0,
end: end
},
{
type: 'inside',
realtime: true,
start: 0,
end: end
}
],
series: [{
name:'销售额',
data: detail,
type: 'line',
itemStyle:{
normal:{
color:'#4cabdd',
lineStyle:{
color:'#4cabdd',
width:3
}
}
}
}]
};
if (option && typeof option === "object") {
myChart.setOption(option, true);
}
}


echarts手机端,数据多时可以滚动的更多相关文章

  1. JGUI源码:Accordion鼠标中键滚动和手机端滑动实现(2)

    本文是抽屉组件在PC端滚动鼠标中键.手机端滑动时,滚动数据列表实现方法,没有使用iscroll等第三方插件,支持火狐,谷歌,IE8+等浏览器. 演示在:www.jgui.com Github地址:ht ...

  2. 移动手机端H5无缝间歇平滑向上滚动js代码

    在没结合css3的transform实现平滑过渡前,我都是用的jquery的animate方法,此方法在PC端基本看不出来有稍微卡顿的现象,但是在性能不高的手机上使用该方法,就会有明显的卡顿现象,不够 ...

  3. fullpage 单屏高度超过屏幕高度,实现单屏内可以滚动并解决手机端单屏高度不正确的问题

    最近接触了好几次jquery.fullpage.js这个插件,实现整屏的滑动,效果很炫,用fullpage来实现也很简单,但是也碰到了一些问题和大家分享一下 1.单屏高度超过屏幕高度,实现单屏的滑动 ...

  4. 自己动手丰衣足食,h5手机端jquery弹窗插件(事件冒泡、单例模式、遮盖部分禁止默认滚动)

    感谢浏览,欢迎交流=.= 公司开发微信网页多处需要使用弹窗,使用jquery-ui的定制化下载仍需要150多kb,想来有些奢侈(最终下来只有11kb,压缩后2kb,啊,我的神), 手机端弹窗方式与pc ...

  5. delphi xe5 android 开发数据访问手机端(一)

    上几片文章我们把供手机端调用的web服务完成,接下来实现手机端调用webservices获取数据 1.新建firemonkey mobile application 2.选择blank applica ...

  6. Fiddler抓取手机端(ios+android)APP接口数据(http+https)

    (1)android 环境要求: PC机和手机连接在同一网络下 工具下载地址: Fiddler网上可以下载,自行下载.注意:需要安装fiddlercertmaker(网上自行下载)进行认证 配置步骤: ...

  7. XE5 Android 开发数据访问手机端[转]

    把供手机端调用的web服务完成,接下来实现手机端调用webservices获取数据 1.新建firemonkey mobile application 2.选择blank application 3. ...

  8. 11.采集手机端app企查查上司公司数据(未成功)

    ---恢复内容开始--- 采集企查查手机端app数据: 1.首先手机端安装app并usb连接电脑端,fiddler监控手机请求数据对数据进行分析抓取. 手机端界面与fiddler界面参照: 2.对获取 ...

  9. charles捕获手机端请求数据

    charles是mac os中的一款类似于windows下fiddler的代理软件,个人感觉比fiddler功能强大:通过charles可以实现指定的请求响应.篡改请求内容.延迟请求.捕获手机端请求等 ...

随机推荐

  1. 为什么Redis集群要使用反向代理?

    为什么要使用反向代理? 如果没有方向代理,一台Redis可能需要跟很多个客户端连接: 看着是不是很慌?看没关系,主要是连接需要消耗线程资源,没有代理的话,Redis要将很大一部分的资源用在与客户端建立 ...

  2. 最新Ceph L版与openstack Pike对接

    安装Ceph luminous   实验环境 三台服务器,每台服务器都有4块硬盘,每台服务器都将自己的第一块硬盘作为系统盘,剩下的做ceph   一.在所有服务器上操作 #使用阿里源 yum inst ...

  3. navicat连接阿里云mysql数据库服务器遇到的1130等相关问题

    最近搭建自己的博客网站的时候使用了阿里云的云服务器ESC,搭建了一个mysql数据库,在windows下使用navicat连接mysql的时候,总是连接不上,出现了1130的问题等等错误信息. 下面将 ...

  4. java导出xls

    package com.spring.mvc.xls; import java.io.File;import java.io.FileInputStream;import java.text.Deci ...

  5. OSPF优化

    1.点对点(背靠背)的优化 两台设备直连(逻辑上的直连). 将OSPF宣告接口配置为点对点模式,不用选举DR.减少20S时间 interface Ethernet0/1 ip ospf network ...

  6. DDD领域驱动设计:CQRS

    1 前置阅读 在阅读本文章之前,你可以先阅读: DDD领域驱动设计是什么 DDD领域驱动设计:实体.值对象.聚合根 DDD领域驱动设计:仓储 MediatR一个优秀的.NET中介者框架 2 什么是CQ ...

  7. 记一次由sql注入到拿下域控的渗透测试实战演练(下)

    本次渗透使用工具: mimikatz,PsExec 本次渗透网络拓扑图: 开始渗透: 上一篇文章中我们讲到我们成功渗透了目标内网中web服务器并提取其管理员明文密码,通过明文密码又成功登陆了内网中的另 ...

  8. CCPC2019网络赛总结

    比赛那会过了两道题,哇贼激动,然后后面就没有然后了... 1003我想到用$kmp$,于是不会$kmp$的我开始找板子套,结果$TLE$,就觉得应该是优化不行,优化后AC妥妥$TLE$,就放弃了. 钓 ...

  9. Codeforces错题本

    为什么我这么菜啊QAQ Codeforces 1364C

  10. priority_queue()大根堆和小根堆(二叉堆)

    #include<iostream> #include <queue> using namespace std; int main() { //对于基础类型 默认是大顶堆 pr ...