<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. fetch_array()与fetch_assoc()的用法

    fetch_array()与fetch_assoc()用起来没有什么大的差别,主要是怎么用?fetch_array()如果单独作为while的条件,则能够取出结果集中的所有结果.如果单独作用于结果集, ...

  2. 项目常用解决方案之SystemSetting.xml文件的修改与读取

    Winform及WPF项目中经常会用到类似SystemSetting.xml等类似的文件用于保存CLIENT的数据,比如登录过的用户名或密码以及其他设置.所以就想到一个解决方法,可以用到所有有此需求的 ...

  3. 详细介绍javascript中的几种for循环的区别

    偶然间见到了forEach循环,感觉很新奇,就研究了一下,顺带着把js中的几种for循环做了一个比较. 首先,简单说一下,js中一共大概有四种for循环:(1).那种简单常见的for循环:(2).fo ...

  4. Hibernate常用方法之_删除

    1.使用session的delete方法 public void deleteUser(User user){ Session session = null; Transaction transact ...

  5. 黑群晖DSM 6.1网卡支持列表

    黑群晖DSM 6.1网卡支持列表 Network Drivers====================================AMDamd8111e : AMD 8111 (new PCI ...

  6. eclipse关闭错误警告提示

  7. 使用Idea远程部署调试tomcat

    转自:http://blog.csdn.net/jane1229/article/details/52402119 远程服务器的配置: 1.在远程服务器安装jdk和tomcat 2.配置环境变量 PA ...

  8. centos7.6升级ssh7.9、安装PHP7.2、Nginx1.15.9、PHP加密扩展php_screw1.5

    1.centos7 安装PHP7.2版本 #查询是否安装过php yum list installed | grep php yum provides php #移除php yum remove ph ...

  9. TCP(二)

    TCP半连接和全连接问题 TCP握手过程详解 如上图所示,关键部分:syns queue(半连接队列)和accept queue(全连接队列) 正常情况下的处理过程如下: 1)当server端收到cl ...

  10. JAVA 成员访问权限修饰符

    修饰符         类内部     package内         子类         其他 public             允许         允许                 ...