<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. 【bzoj1458】士兵占领 有上下界最小流

    题目描述 有一个M * N的棋盘,有的格子是障碍.现在你要选择一些格子来放置一些士兵,一个格子里最多可以放置一个士兵,障碍格里不能放置士兵.我们称这些士兵占领了整个棋盘当满足第i行至少放置了Li个士兵 ...

  2. Python 日期时间相关

    #calendar日历模块 import calendar #calendar() 获取一年日历 result = calendar.calendar(2018,w = 2,l = 1,c = 6,m ...

  3. HDU 6153 A Secret（扩展KMP模板题）

    A Secret Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 256000/256000 K (Java/Others) Total ...

  4. ZOJ 3496 Assignment | 二分+有上下界网络流

    题目: http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3496 大概意思:给你一个网络,有源汇,在保证最大流的情况下求下面两 ...

  5. 树剖模板by fcdalao

    #include<bits/stdc++.h> using namespace std; ; *MX]; *MX]; int n,Index,fir[MX],fa[MX],dfn[MX], ...

  6. 牛客多校对抗第6场 A Singing Contest

    [20分]标题:A.Singing Contest | 时间限制:1秒 | 内存限制:256MJigglypuff is holding a singing contest. There are 2n ...

  7. AWS nat monitor and route switch script

    This script will monitor another NAT instance and take over its routes if communication with the oth ...

  8. SQLyog 使用笔记，自增主键数据冲突错误

    select max(id) from test ; desc test ; insert into  test (a,b,c) values ('abc','123-213','test'); RE ...

  9. Java并发（6）- CountDownLatch、Semaphore与AQS

    引言 上一篇文章中详细分析了基于AQS的ReentrantLock原理,ReentrantLock通过AQS中的state变量0和1之间的转换代表了独占锁.那么可以思考一下,当state变量大于1时代 ...

  10. js错误处理

    导致程序无法继续执行的异常状态称为错误. js中一旦发生错误,就会自动创建一个Error类型对象 js中有6中错误类型: SyntaxError 语法错误 ReferenceError 引用错误,找不 ...