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 相关文章推荐
简单的过滤字符串中的HTML标记
Dec 25 PHP
php采集速度探究总结(原创)
Apr 18 PHP
php通用防注入程序 推荐
Feb 26 PHP
apache mysql php 源码编译使用方法
May 03 PHP
php调用方法mssql_fetch_row、mssql_fetch_array、mssql_fetch_assoc和mssql_fetch_objcect读取数据的区别
Aug 08 PHP
php cURL和Rolling cURL并发方式比较
Oct 30 PHP
ThinkPHP中的系统常量和预定义常量集合
Jul 01 PHP
php实现在服务器上创建目录的方法
Mar 16 PHP
使用 PHPStorm 开发 Laravel
Mar 24 PHP
php微信公众号js-sdk开发应用
Nov 28 PHP
php使用PDO下exec()函数查询执行后受影响行数的方法
Mar 28 PHP
PHP分享图片的生成方法
Apr 25 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
Windows2003 下 MySQL 数据库每天自动备份
2006/12/21 PHP
php使用function_exists判断函数可用的方法
2014/11/19 PHP
php提交过来的数据生成为txt文件
2016/04/28 PHP
完美解决php 导出excle的.csv格式的数据时乱码问题
2017/02/18 PHP
URL编码转换,escape() encodeURI() encodeURIComponent()
2006/12/27 Javascript
JQuery $.each遍历JavaScript数组对象实例
2014/09/01 Javascript
jquery ui bootstrap 实现自定义风格
2014/11/14 Javascript
推荐6款基于jQuery实现图片效果插件
2014/12/07 Javascript
node.js中的path.dirname方法使用说明
2014/12/09 Javascript
JQuery使用index方法获取Jquery对象数组下标的方法
2015/05/18 Javascript
JS实现n秒后自动跳转的两种方法
2020/11/30 Javascript
瀑布流的实现方式(原生js+jquery+css3)
2020/06/28 Javascript
解决node.js安装包失败的几种方法
2016/09/02 Javascript
js制作可以延时消失的菜单
2017/01/13 Javascript
angularJS+requireJS实现controller及directive的按需加载示例
2017/02/20 Javascript
JS闭包的几种常见形式实例详解
2017/09/16 Javascript
Angular2仿照微信UI实现9张图片上传和预览的示例代码
2017/10/19 Javascript
angular 实时监听input框value值的变化触发函数方法
2018/08/31 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
2019/08/23 Javascript
vue控制多行文字展开收起的实现示例
2019/10/11 Javascript
基于纯JS实现多张图片的懒加载Lazy过程解析
2019/10/14 Javascript
JS原型对象操作实例分析
2020/06/06 Javascript
python 生成目录树及显示文件大小的代码
2009/07/23 Python
在Python的Django框架中加载模版的方法
2015/07/16 Python
Python 实现在文件中的每一行添加一个逗号
2018/04/29 Python
基于python plotly交互式图表大全
2019/12/07 Python
django queryset相加和筛选教程
2020/05/18 Python
CSS3+JavaScript实现炫酷呼吸效果的示例代码
2020/06/15 HTML / CSS
开发中都用到了那些设计模式?用在什么场合?
2014/08/21 面试题
利用指针变量实现队列的入队操作
2012/04/07 面试题
数学检讨书1000字
2014/02/24 职场文书
生产部厂长助理职位说明书
2014/03/03 职场文书
社团活动总结书
2014/06/27 职场文书
社会实践活动报告
2015/02/05 职场文书
财务部岗位职责范本
2015/04/14 职场文书
高三语文教学反思
2016/02/16 职场文书