Witam
Widzialem na forum podobne watki, ale cos u mnie nie dziala tak jka byc tego chcial.
Mam nastepujace skrypty:
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=utf-8" />
<title>TEST</title>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<body onload="ajax_update();">
<?php
echo "<div id='content'>Loading</div>\n"; ?>
</body>
</html>
ajax.js
var xmlhttp = false ;
if (!xmlhttp && typeof XMLHttpRequest != 'undefined')
{
try {
xmlhttp = new XMLHttpRequest ();
}
catch (e) {
xmlhttp = false}
}
function myXMLHttpRequest ()
{
var xmlhttplocal;
try {
xmlhttplocal = new ActiveXObject ("Msxml2.XMLHTTP")}
catch (e) {
try {
xmlhttplocal = new ActiveXObject ("Microsoft.XMLHTTP")}
catch (E) {
xmlhttplocal = false;
}
}
if (!xmlhttplocal && typeof XMLHttpRequest != 'undefined') {
try {
var xmlhttplocal = new XMLHttpRequest ();
}
catch (e) {
var xmlhttplocal = false;
}
}
return (xmlhttplocal);
}
var mnmxmlhttp = Array ();
var mnmString = Array ();
var mnmPrevColor = Array ();
var responsestring = Array ();
var myxmlhttp = Array ();
var responseString = new String;
var i=0;
var ii = 0;
function ajax_update()
{
url = "graph.php";
//url = "demo/DirectPNGOutputTest.php"
target2 = document.getElementById ('content');
ii = i++;
var content = "i=" + ii ;
mnmxmlhttp = new myXMLHttpRequest ();
if (mnmxmlhttp) {
mnmxmlhttp.open ("POST", url, true);
mnmxmlhttp.setRequestHeader ('Content-Type',
'application/x-www-form-urlencoded');
mnmxmlhttp.send (content);
errormatch = new RegExp ("^ERROR:");
target2 = document.getElementById ('content');
mnmxmlhttp.onreadystatechange = function () {
if (mnmxmlhttp.readyState == 4) {
mnmString = mnmxmlhttp.responseText;
if (mnmString.match (errormatch)) {
mnmString = mnmString.substring (6, mnmString.length);
target = document.getElementById ('content');
//target2.innerHTML = mnmString;
target2.innerHTML = '
<img border="0" src="graph.php">';
} else {
target = document.getElementById ('content');
//target2.innerHTML = mnmString;
target2.innerHTML = '
<img border="0" src="graph.php">';
}
}
}
}
setTimeout('ajax_update()', 1000);
}
graph.php
<?php
/*
Code written by Adam Crownoble adam@obleDesign.com
You may take this code this code and change it
however you like. My only request is that keep
this comment in place and comment your own
changes. Happy coding.
This code dynamically renders a thermostat as an
image. It is meant to be used to gauge donations to
a project.
*/
// Get variables
$goal = $_GET['goal'];
$progress = $_GET['progress'];
if($progress && $goal) { $temp = $progress / $goal; }
// Image dimensions
if(!$w = $_GET['w']) { $w = 45; }
if(!$h = $_GET['h']) { $h = 150; }
// Border
$border_w = 1;
// Tube Dimensions
$tube_w_ratio = .6;
$tube_w = $w * $tube_w_ratio;
$tube_h = $h - ($w);
$tube_l = ($w - $tube_w) / 2;
$tube_r = $w - $tube_l;
// Ball Dimensions
$ball_w = $w;
$ball_cnt_x = $ball_w / 2;
$ball_cnt_y = $h - ($ball_cnt_x);
// Marks
$mark_num = 10;
$mark_w_min_ratio = .15;
$mark_w_max_ratio = .3;
$mark_w_min = $tube_w * $mark_w_min_ratio;
$mark_w_max = $tube_w * $mark_w_max_ratio;
$mark_spacing = $tube_h / $mark_num;
// Image
$img = imagecreatetruecolor($w,$h);
// Settings
imageantialias($img,true);
imagesetthickness($img,$border_w);
// Colors
$black = imagecolorallocate($img,100,100,100);
$white = imagecolorallocate($img,255,255,255);
$gray = imagecolorallocate($img,225,225,225);
$red = imagecolorallocate($img,190,0,0);
// Background
imagefilledrectangle($img,0,0,$w,$h,$white);
// Draw Tube
imagefilledrectangle($img,
$tube_l,
0,
$tube_r,
$tube_h,
$gray);
// Top
imageline($img,
$tube_l,
0,
$tube_r,
0,
$black);
// Left
imageline($img,
$tube_l,
0,
$tube_l,
$tube_h + ($ball_w / 2),
$black);
// Right
imageline($img,
$tube_r,
0,
$tube_r,
$tube_h + ($ball_w / 2),
$black);
// Draw Ball
imagefilledellipse($img,
$ball_cnt_x,
$ball_cnt_y,
$ball_w,
$ball_w,
$red);
imageellipse($img,
$ball_cnt_x,
$ball_cnt_y,
$ball_w,
$ball_w,
$black);
// Draw Mercury
imagefilledrectangle($img,
$tube_l + $border_w,
$tube_h - ($tube_h * $temp),
$tube_r - $border_w,
$tube_h + ($ball_w / 2)
+ $border_w,
$red);
// Draw Marks
for($i = 1; $i <= $mark_num; $i++) {
if(1&$i) {
$mark_w = $mark_w_min;
} else {
$mark_w = $mark_w_max;
}
imageline($img,
$tube_l,
$mark_spacing * $i,$tube_l + $mark_w,
$mark_spacing * $i,
$black);
}
// Set the content type to PNG
header("Content-type: image/png");
// Output the image
imagepng($img);
// Clear up the resources
imagedestroy($img);
?>
Wszystko niby smiga, obrazek niby sie odswieza, ale zmiany parametrow w pliku graph.php nie sa widoczne.
Sytuacja wyglada tak, jak gdyby AJAX nie odsieżał pliku graph.php lub nie potrafil pretworzyc grafiki.
Pozdrawiam wszystkich
// Następnym razem patrz jakie bbcode dodajesz.
// Tag manual na pewno nie jest dla JasvaScript.
// ~webdice
Ten post edytował webdice 8.02.2009, 23:55:22