php+mysql折线图
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Highcharts Example</title> <?php
$conn=mysql_connect("localhost","root","") or die ("连接失败");
mysql_query("set names utf8",$conn);
mysql_select_db("office",$conn);
$sql="SELECT convert(SUM(`total2`) ,decimal(10,2)) as total,`payment_date`as day FROM `toa_order`WHERE TIMESTAMPDIFF(DAY,`payment_date`,DATE(NOW()))<7 group by `payment_date`";
$result=mysql_query($sql,$conn);
$day[] = array();
$count[] =array(); while($row = mysql_fetch_array($result))
{
$day[]=$row['day'];
$count[]=intval($row['total']);
}
$day = json_encode($day); $data1 = array(array("name"=>"day","data"=>$count));
$data1 = json_encode($data1); //把获取的数据对象转换成json格式
?> <script type="text/javascript" src="http://cdn.hcharts.cn/jquery/jquery-1.8.3.min.js"></script>
<script src="js/highcharts.js"></script>
<script src="js/modules/exporting.js"></script>
<script type="text/javascript">
$(function () {
$('#container').highcharts({
title: {
text: 'Publish times',
x: -20 //center
},
subtitle: {
text: 'write by:DongGe',
x: -20
},
xAxis: {
categories: <?php echo $day; ?>
},
yAxis: {
title: {
text: '金 额'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
},
tooltip: {
valueSuffix: '元'
},
legend: {
layout: 'vertical',
align: 'right',
verticalAlign: 'middle',
borderWidth: 0
},
series: <?php echo $data1; ?>
});
});
</script> </head>
<body> <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> </body>
</html>
需引用的js:highcharts.js、jquery.highchartTable.js、jquery-1.8.2.min.js
php+mysql折线图的更多相关文章
- highcharts实例教程一:结合php与mysql生成折线图
Highcharts是一款纯javascript和html5编写的图表库,不仅几乎能兼容所有pc浏览器,而且对ios和android手机端的兼容 性也不错,它能够很简单便捷的在Web网站或Web应用中 ...
- C# 实时折线图,波形图
此Demo是采用VS自带的Chart图表控件,制作实时动态显示的折线图,和波形图. 涉及到知识如下: Chart 控件,功能强大,可以绘制柱状图,折线图,波形图,饼状图,大大简化了对图的开发与定制. ...
- Android开发学习之路-自定义控件(天气趋势折线图)
之前写了个天气APP,带4天预报和5天历史信息.所以想着要不要加一个折线图来显示一下天气变化趋势,难得有空,就写了一下,这里做些记录,脑袋不好使容易忘事. 先放一下效果: 控件内容比较简单,就是一个普 ...
- react-echarts之折线图的显示
react中想要实现折线图和饼图的功能,需要引入react-echarts包,然后再实现折线图的功能.我这里引用的版本是:0.1.1.其他的写法参echarts官网即可.下面详细讲解的是我在react ...
- 用canvas绘制折线图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- MPAndroidChart 3.0——LineChart(折线图)
显示效果 MPAndroidChart每一种图表的基本使用方式都基本相同 了解一种图表的实现 参考项目源码其他的图表也就差不多哩 在布局文件中定义 <com.github.mikephil.ch ...
- echart折线图小知识
1)在折线图中,有时我们不想让太多折线显示,那么就隐藏,点击legend区域文字再显示. 比如我们要隐藏的折线叫"联盟广告",代码如下 var selected = {}; sel ...
- hellocharts的折线图与柱状图的结合之ComboLineColumnChartView
哼哼,网上找了半天都不全,所以决定自己写一个完整的可以直接贴代码的 test.xml <?xml version="1.0" encoding="utf-8&quo ...
- Android自定义折线图
老师布置了个作业:http://www.cnblogs.com/qingxu/p/5316897.html 作业中提到的 “玩了几天以后,大家发现了一些很有意思的现象,比如黄金点在逐渐地往下移动.” ...
随机推荐
- Java进阶
Java进阶(一)Annotation(注解) Java进阶(二)当我们说线程安全时,到底在说什么 Java进阶(三)多线程开发关键技术 Java进阶(四)线程间通信方式对比 Java进阶(五)NIO ...
- 全局 Ajax 事件处理器
jQuery中将Ajax请求和响应分成了若干(5)个阶段 并且允许开发者在Ajax请求和响应的不同阶处理不同的逻辑, 这些方法用于注册事件处理器,用来处理页面上的任何 Ajax 请求,当某些事件触发后 ...
- 背景图片移动插件MyFloatingBg(浮动背景图效果,可让背景随着页面的滚动而滚动)
MyFloatingBg这插件可以帮助你在网页上加入可移动背景Background.你可以用于整个文件的背景,或是某几个banner的背景. 它可支持简单的animation效果,你不用去做一个fla ...
- 关于HTML中的object元素
<object>元素:它主要用于定义网页中的多媒体,比如音频,视频,Java applets,PDF,Active和Flash.object标签内除了param标签外,其他的内容将在浏览器 ...
- BZOJ4584 APIO2016赛艇(动态规划+组合数学)
如果值域不大,容易想到设f[i][j]为第i个学校选了j的方案数,枚举上一个学校是哪个选了啥即可,可以前缀和优化.于是考虑离散化,由于离散化后相同的数可能可以取不同的值,所以枚举第一个和其所选数(离散 ...
- 【转】Win7装不上Office2010 提示MSXML 6.10.1129.0
转自:http://zhidao.baidu.com/link?url=aZPbpBu0Fb7rc8HCb_NuonuZ4ET_BB8_NgZ96tCpB9dyuUyWVwMl78MLa7rh-rfx ...
- [CF475E]Strongly Connected City 2
题目大意:给一张$n(n\leqslant2000)$个点的无向图,给所有边定向,使定向之后存在最多的有序点对$(a,b)$满足从$a$能到$b$ 题解:先把边双缩点,因为这里面的点一定两两可达. 根 ...
- Topcoder SRM579 1000pts
石头剪刀布QAQ 一看是个很油的概率dp 首先一看你很快能得出状态的表示F[i][r][p][s] 然后只要考虑r,p,s出现的次数来进行概率dp就好了 具体实现的时候细节很多(少) 如果预处理一下组 ...
- taotao购物车
功能分析: 1.在用户不登陆的情况下也可以使用购物车,那么就需要把购物车信息放入cookie中. 2.可以把商品信息,存放到pojo中,然后序列化成json存入cookie中. 3.取商品信息可以从c ...
- The 13th Zhejiang Provincial Collegiate Programming Contest - C
Defuse the Bomb Time Limit: 2 Seconds Memory Limit: 65536 KB The bomb is about to explode! Plea ...