<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折线图的更多相关文章

  1. highcharts实例教程一:结合php与mysql生成折线图

    Highcharts是一款纯javascript和html5编写的图表库,不仅几乎能兼容所有pc浏览器,而且对ios和android手机端的兼容 性也不错,它能够很简单便捷的在Web网站或Web应用中 ...

  2. C# 实时折线图,波形图

    此Demo是采用VS自带的Chart图表控件,制作实时动态显示的折线图,和波形图. 涉及到知识如下: Chart 控件,功能强大,可以绘制柱状图,折线图,波形图,饼状图,大大简化了对图的开发与定制. ...

  3. Android开发学习之路-自定义控件(天气趋势折线图)

    之前写了个天气APP,带4天预报和5天历史信息.所以想着要不要加一个折线图来显示一下天气变化趋势,难得有空,就写了一下,这里做些记录,脑袋不好使容易忘事. 先放一下效果: 控件内容比较简单,就是一个普 ...

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

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

  5. 用canvas绘制折线图

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. MPAndroidChart 3.0——LineChart(折线图)

    显示效果 MPAndroidChart每一种图表的基本使用方式都基本相同 了解一种图表的实现 参考项目源码其他的图表也就差不多哩 在布局文件中定义 <com.github.mikephil.ch ...

  7. echart折线图小知识

    1)在折线图中,有时我们不想让太多折线显示,那么就隐藏,点击legend区域文字再显示. 比如我们要隐藏的折线叫"联盟广告",代码如下 var selected = {}; sel ...

  8. hellocharts的折线图与柱状图的结合之ComboLineColumnChartView

    哼哼,网上找了半天都不全,所以决定自己写一个完整的可以直接贴代码的 test.xml <?xml version="1.0" encoding="utf-8&quo ...

  9. Android自定义折线图

    老师布置了个作业:http://www.cnblogs.com/qingxu/p/5316897.html 作业中提到的 “玩了几天以后,大家发现了一些很有意思的现象,比如黄金点在逐渐地往下移动.” ...

随机推荐

  1. dechex()

    dechex() 函数把十进制转换为十六进制生成验证码的时候用到了

  2. BZOJ4415 SHOI2013发牌(线段树)

    似乎是noip2017d2t3的一个部分分.用splay的话当然非常裸,但说不定会被卡常.可以发现序列中数的(环上)相对位置是不变的,考虑造一棵权值线段树维护权值区间内还有多少个数留在序列中,每次在线 ...

  3. BZOJ1927 [Sdoi2010]星际竞速 【费用流】

    1927: [Sdoi2010]星际竞速 Time Limit: 20 Sec  Memory Limit: 259 MB Submit: 2582  Solved: 1601 [Submit][St ...

  4. Codeforces 931.D Peculiar apple-tree

    D. Peculiar apple-tree time limit per test 1 second memory limit per test 256 megabytes input standa ...

  5. angularjs的验证信息的写法

    <div ng-messages="alarmDelayForm.alarmRuleName.$error" role="alert"> <d ...

  6. JavaScript 页面间传值

    转自:http://blog.csdn.net/qq380107165/article/details/7330612 一:JavaScript静态页面值传递之URL篇 能过URL进行传值,把要传递的 ...

  7. loj6100 「2017 山东二轮集训 Day1」第一题

    传送门:https://loj.ac/problem/6100 [题解] 我们考虑维护从某个端点开始的最长满足条件的长度,如果知道了这个东西显然我们可以用主席树来对每个节点建棵关于右端点的权值线段树, ...

  8. [BZOJ2453]维护队列|分块

    Description 你小时候玩过弹珠吗? 小朋友A有一些弹珠,A喜欢把它们排成队列,从左到右编号为1到N.为了整个队列鲜艳美观,小朋友想知道某一段连续弹珠中,不同颜色的弹珠有多少.当然,A有时候会 ...

  9. 【洛谷 P1337】[JSOI2004]平衡点 / 吊打XXX (模拟退火)

    题目链接 正解就算了吧,谁叫我理生化 语数外 政史地都菜呢 模拟退火真玄学,不知道发生了什么就跑出答案了,原理就算了吧,能用(pianfen)就好. 当重物平衡时,势能一定是最小的,于是当我随机出一个 ...

  10. bzoj 2142 国家集训队试题 礼物

    问题转化成求C(N,M) mod P p为非素数,那么我们可以将P分解质因数, 也就是 π pi^ci的形式,因为这些pi^ci是互质的,所以我们可以用crt将他们合并 那么问题就转化成了快速求C(N ...