highcharts实例教程一:结合php与mysql生成折线图
Highcharts是一款纯javascript和html5编写的图表库,不仅几乎能兼容所有pc浏览器,而且对ios和android手机端的兼容 性也不错,它能够很简单便捷的在Web网站或Web应用中添加交互性的图表,Highcharts目前支持直线图、折线图、面积图、柱状图、饼图、散点图 等多达28种不同类型的图表,还支持3D立体图表的生成,可以满足你对Web图表的任何需求 !而且Highcharts对学习者、非商业机构是免费使用的。
案例场景:要求针对技术cto网站,直观地显示一周网站pv、uv的变化曲线;
编程实现:
1、首先创建数据库,保存网站每天的数据;
CREATE TABLE `line` (
`id` int(10) NOT NULL AUTO_INCREMENT,
`pv` int(10) DEFAULT NULL,
`uv` int(10) DEFAULT NULL,
`did` int(10) DEFAULT NULL,
PRIMARY KEY (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=utf8;
2、编写php代码从数据库中获取到每天网站的数据;
include_once('connect.php');
$res = mysql_query("select * from line");
while($row = mysql_fetch_array($res)){
$pv[] = intval($row['pv']); //注意这里必须要用intval强制转换,不然图表不能显示
$uv[] = intval($row['uv']);
}
$data = array(array("name"=>"pv","data"=>$pv),array("name"=>"uv","data"=>$uv));
$data = json_encode($data); //把获取的数据对象转换成json格式
效果展示:

本文出自技术CTO:http://www.jscto.net,转载请注明出处。
highcharts实例教程一:结合php与mysql生成折线图的更多相关文章
- 使用Highcharts生成折线图_at last
//数据库数据的读取,读取数据后数据格式的转换,还有highchart数据源的配置,伤透了脑筋. anyway,最终开张了.哈哈! 数据库连接:conn_orcale.php <?php $db ...
- 使用Highcharts生成折线图与曲线图
折线图与曲线图可以显示随时间而变化的连续数据,因此非常适用于显示在相等时间间隔下数据的趋势.本文将结合Highcharts,生成一个城市气温变化折线图和一个随时间动态即时显示CPU走势的曲线图. 如果 ...
- 【Cocos2d实例教程一】xcode5下Cocos2d环境的搭建
(转载请注明出处:http://blog.csdn.net/buptgshengod) 第一步,现在要安装集成环境xcode5,安装xcode5需要系统至少是os x 10.8.5. 第二步,下载co ...
- PowerDesigner连接 MySQL 生成 ER图
powerdesigner 16.5 http://www.pcsoft.com.cn/soft/27495.html jdk 1.8 32位 https://mirrors.huaweicloud. ...
- highcharts实例教程二:结合php与mysql生成饼图
上回我们分析了用highcharts结合php和mysql生成折线图的实例,这次我们以技术cto网站搜索引擎流量为例利用highcharts生成饼图. 饼图通常用在我们需要直观地显示各个部分所占的比例 ...
- HighCharts实现多数据折线图分列显示
HighCharts实现多数据折线图分列显示 BY ZYZ HighCharts是一个很好用的web端绘图插件,用起来很方便,它的官方支持很好.并且有中文API(不全然).画出来的图像也挺美丽的. 近 ...
- MySQL 【教程一】
前言 什么是数据库? 数据库(Database)是按照数据结构来组织.存储和管理数据的仓库. 每个数据库都有一个或多个不同的 API 用于创建,访问,管理,搜索和复制所保存的数据. 我们也可以将数据存 ...
- Quartz教程一:使用quartz
原文链接 | 译文链接 | 翻译:nkcoder | 校对:方腾飞 本系列教程由quartz-2.2.x官方文档翻译.整理而来,希望给同样对quartz感兴趣的朋友一些参考和帮助,有任何不当或错误之处 ...
- CRL快速开发框架系列教程一(Code First数据表不需再关心)
本系列目录 CRL快速开发框架系列教程一(Code First数据表不需再关心) CRL快速开发框架系列教程二(基于Lambda表达式查询) CRL快速开发框架系列教程三(更新数据) CRL快速开发框 ...
随机推荐
- MFC 显示CImg图片
很多示例关于CImg都是基于控制台的,如何把它用于MFC中显示. Problem:直接按照控制台示例写入MFC程序中,当程序执行完display后,其后面的代码便不再执行. solution:开辟新的 ...
- Big Event in HDU(01背包)
/* 题意: 输入一个数n代表有n种物品, 接下来输入物品的价值和物品的个数: 然后将这些物品分成A B 两份,使A B的价值尽可能相等也就是尽量分的公平一些,如果无法使A B相等,那么就使A多一些: ...
- 《A First Course in Probability》-chape6-随机变量的联合分布-基本概念
之前我们探讨了一元随机变量的分布列,下面我们应该将相应的性质推广到多元随机变量的分布列,在这里我们主要以讨论二元随机变量分布列为主. 利用类比的方法,我们很容易将一元随机变量的分布列的性质推广上来. ...
- [转]机器学习&数据挖掘笔记_16(常见面试之机器学习算法思想简单梳理)
机器学习&数据挖掘笔记_16(常见面试之机器学习算法思想简单梳理) 转自http://www.cnblogs.com/tornadomeet/p/3395593.html 前言: 找工作时(I ...
- Java内存管理以及各个内存区域详解
一.概述 原文链接:http://blog.csdn.net/l271640625/article/details/39761439 Java虚拟机在执行Java程序的过程中会把它所管理的内存划分为若 ...
- jiaocheng https://github.com/CarpenterLee/JCFInternals
https://github.com/CarpenterLee/JCFInternals
- 快速查询本机IP 分类: windows常用小技巧 2014-04-15 09:28 138人阅读 评论(0) 收藏
第一步: 点击windows建(屏幕左下方),在搜索程序和文件文本框内输入:cmd 第二步: 点击Enter建进入. 第三步: 输入:ipconfig即可. 版权声明:本文为博主原创文章,未 ...
- 加载GIF动画方法 iOS
方法一 使用UIWebView _codeStr为gif网址 如果是本地的gif可以直接使用dataWithContentsOfFile方法 NSData *data = [NSData d ...
- setTimeout的作用以及setTimeout延时0毫秒的作用
以下代码输出的顺序是? console.log(1); setTimeout(function(){ console.log(2); }, 0); setTimeout(function(){ con ...
- iOS开发之监测网络状态
一.说明 在网络应用中,需要对用户设备的网络状态进行实时监控,有两个目的: (1)让用户了解自己的网络状态,防止一些误会(比如怪应用无能) (2)根据用户的网络状态进行智能处理,节省用户流量,提高用户 ...