Ajax+Jpgraph实现的动态折线图功能示例


Posted in PHP onFebruary 11, 2019

本文实例讲述了Ajax+Jpgraph实现的动态折线图功能。分享给大家供大家参考,具体如下:

一 代码

fun.js:

var i=1;
function progress(){
  setInterval("beginProgress()", 600);
}
function beginProgress(){
 $("#img").attr("src", "img.php?m="+i);
 i++;
 if(i>=12){
   i=1;
 }
}

index.php:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Ajax+Jpgraph制作动态折线图</title>
</head>
<script language="javascript" src="js/jquery-1.3.2.js"></script>
<script language="javascript" src="js/fun.js"></script>
<body>
  <img id="img" src="img.php?m=0" />
 <br>
 <input type="button" value="开始" onclick="progress()"/>
</body>
</html>

img.php:

<?php
require_once 'src/jpgraph.php';   //导入Jpgraph类库
require_once 'src/jpgraph_line.php';   //导入Jpgraph类库的柱状图功能
$dataTmp = array(56, 78, 34, 65, 89, 24 ,67 ,88, 45, 68, 70, 50);   //设置统计数据
$data1 = array(0, 0, 0, 0, 0, 0 ,0 ,0, 0, 0, 0, 0);   //设置统计数据
$m = $_GET['m'];
for($i=0; $i<$m; $i++){
  $data1[$i] = $dataTmp[$i];
}
$graph = new Graph(500, 320);
$graph->SetScale("textlin");
$graph->SetShadow();
$graph->img->SetMargin(40, 30, 30, 70);
$graph->title->Set("图书销售走势表");
$lineplot1 = new LinePlot($data1);
$graph->Add($lineplot1);
$graph->xaxis->title->Set("月份");
$graph->yaxis->title->Set("book A销售金额(万元)");
$graph->title->SetFont(FF_SIMSUN, FS_BOLD);
$graph->yaxis->title->SetFont(FF_SIMSUN, FS_BOLD);
$graph->xaxis->title->SetFont(FF_SIMSUN, FS_BOLD);
$lineplot1->SetColor('red');
$lineplot1->SetLegend('book A');
$graph->legend->SetLayout(LEGEND_HOR);
$graph->legend->Pos(0.4, 0.95, 'center', 'bottom');
$graph->Stroke();

二 运行结果

Ajax+Jpgraph实现的动态折线图功能示例

希望本文所述对大家PHP程序设计有所帮助。

PHP 相关文章推荐
PHP 和 MySQL 开发的 8 个技巧
Oct 09 PHP
PHP session有效期问题
Apr 26 PHP
php检测图片木马多进制编程实践
Apr 11 PHP
memcache命令启动参数中文解释
Jan 13 PHP
php实现mysql封装类示例
May 07 PHP
PHP根据传入参数合并多个JS和CSS文件的简单实现
Jun 13 PHP
Yii2如何批量添加数据
May 17 PHP
Zend Framework实现自定义过滤器的方法
Dec 09 PHP
Mac系统完美安装PHP7详细教程
Jun 06 PHP
PHP生成(支持多模板)二维码海报代码
Apr 30 PHP
thinkPHP5框架自定义验证器实现方法分析
Jun 11 PHP
PHP 使用位运算实现四则运算的代码
Mar 09 PHP
php防止表单重复提交实例讲解
Feb 11 #PHP
stripos函数知识点实例分享
Feb 11 #PHP
PHP检查URL包含特定字符串实例方法
Feb 11 #PHP
PHP strripos函数用法总结
Feb 11 #PHP
PHP xpath()函数讲解
Feb 11 #PHP
Laravel框架实现超简单的分页效果示例
Feb 08 #PHP
Yii2框架实现利用mpdf创建pdf文件功能示例
Feb 08 #PHP
You might like
php自定义错误处理用法实例
2015/03/20 PHP
php求今天、昨天、明天时间戳的简单实现方法
2016/07/28 PHP
NiftyCube——轻松实现圆角边框
2007/02/20 Javascript
ExtJs中简单的登录界面制作方法
2010/08/19 Javascript
js DOM的学习笔记
2011/12/22 Javascript
Jquery Mobile 自定义按钮图标
2015/11/18 Javascript
Bootstrap实现默认导航栏效果
2020/09/21 Javascript
学习JavaScript设计模式之责任链模式
2016/01/18 Javascript
Laydate时间组件在火狐浏览器下有多时间输入框时只能给第一个输入框赋值的解决方法
2016/08/18 Javascript
js 判断各种数据类型的简单方法(推荐)
2016/08/29 Javascript
JavaScript函数基础详解
2017/02/03 Javascript
原生JavaScript实现AJAX、JSONP
2017/02/07 Javascript
javaScript动态添加Li元素的实例
2018/02/24 Javascript
JavaScript实现邮箱后缀提示功能的示例代码
2018/12/13 Javascript
解决layui的radio属性或别的属性没显示出来的问题
2019/09/26 Javascript
JavaScript 实现同时选取多个时间段的方法
2019/10/17 Javascript
使用JavaScript实现网页秒表功能(含开始、暂停、继续、重置功能)
2020/06/05 Javascript
[47:48]DOTA2上海特级锦标赛D组小组赛#2 Liquid VS VP第三局
2016/02/28 DOTA
[42:32]Secret vs Optic 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
使用Python实现一个简单的项目监控
2015/03/31 Python
Python引用类型和值类型的区别与使用解析
2017/10/17 Python
Python爬虫实现抓取京东店铺信息及下载图片功能示例
2018/08/07 Python
wxPython电子表格功能wx.grid实例教程
2019/11/19 Python
django框架forms组件用法实例详解
2019/12/10 Python
Python多线程获取返回值代码实例
2020/02/17 Python
Python自动化测试中yaml文件读取操作
2020/08/20 Python
前端制作动画的几种方式(css3,js)
2016/12/12 HTML / CSS
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
HTML5新增元素如何兼容旧浏览器有哪些方法
2014/05/09 HTML / CSS
亚历山大·王官网:Alexander Wang
2017/06/23 全球购物
Nike加拿大官网:Nike.com (CA)
2019/04/09 全球购物
Java程序员常见面试题
2015/07/16 面试题
软件工程专业推荐信
2013/10/28 职场文书
项目专员岗位职责
2013/12/04 职场文书
文明餐桌活动方案
2014/02/11 职场文书
根叔历年演讲稿
2014/05/20 职场文书