<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. elementUI默认样式修改不成功的问题

    问题: login.vue中引入<style lang="postcss" src="./login.css" scoped></style& ...

  2. 机器学习：最近邻规则KNN算法

    这个算法就比较简单易懂了 就是把每个向量的特征值抽象成坐标,寻找最近的k个点,来进行划分 代码如下 #include <iostream> #include <cstdio> ...

  3. [bzoj3886] [USACO15JAN]电影移动Moovie Mooving

    题目链接 状压\(dp\). 注意到\(n\leq 20\)且每个只能用一次,所以很显然可以压缩每部电影看过没,记\(f[sta]\)为状态为\(sta\)时最多可以看多久. 转移时先枚举状态,然后枚 ...

  4. [BZOJ4212]神牛的养成计划

    [BZOJ4212]神牛的养成计划 试题描述 Hzwer 成功培育出神牛细胞,可最终培育出的生物体却让他大失所望...... 后来,他从某同校女神 牛处知道,原来他培育的细胞发生了基因突变,原先决定神 ...

  5. LinuxUnix time时间戳的处理转换函数

    Linux/Unix time时间戳的处理转换函数 linux下的时间函数 我们在编程中可能会经常用到时间,比如取得系统的时间(获取系统的年.月.日.时.分.秒,星期等),或者是隔一段时间去做某事,那 ...

  6. BZOJ day1

    十题击破  1051108811921432195119682242245624632761

  7. share-Nothing原理

    Share nothing理论在数据库设计和优化中的实践应用 首先介绍share nothing概念.最早接触它是在 DataBaseManagentSystem一书的并行数据库章节中. 并行数据库要 ...

  8. POJ2594：Treasure Exploration（Floyd + 最小路径覆盖）

    Treasure Exploration Time Limit: 6000MS   Memory Limit: 65536K Total Submissions: 9794   Accepted: 3 ...

  9. Android百度地图的使用

    做关于位置或者定位的app的时候免不了使用地图功能,本人最近由于项目的需求需要使用百度地图的一些功能,所以这几天研究了一下,现写一下blog记录一下,欢迎大家评论指正! 一.申请AK(API Key) ...

  10. java消息中间件入门

    消息中间件来解耦服务调用 比如1个登录系统,登录的话需要调用很多系统的其他服务,如果中间调用失败,可能会导致登录信息一致无法返回,同时也增加了系统的耦合度.而用消息中间件的话,则是不发送服务到其他系统 ...