Hallo,
Ich habe ich einen js code gefunden mit dem ich einen Chart darstellen kann. Da ich aber später die X- und Y-Achse mit Daten aus einer MYSQL-Datenbank versorgen muss, habe ich vorerst versucht die Variable i aus der For-Schleife in php zu übertragen. (Später wird auch Y über Mysql und php verwendet werden.) . Dazu habe ich einen Code in
ajax.frozenfox.at/ajax_002.html gefunden und eingebaut. Jedoch kann ich die die Variable content in meinem Code nicht verwenden. Wahrscheinlich weil diese dann außerhalb der Funktion verwendet wird. Hat da jemand eine Lösung? Danke im voraus
Thomas
Hier noch mal mein Code.
PHP
<?php
header('Content-Type: text/html; charset=utf-8'); // sorgt für die korrekte Kodierung
header('Cache-Control: must-revalidate, pre-check=0, no-store, no-cache, max-age=0, post-check=0'); // ist mal wieder wichtig wegen IE
$name = $_POST['name'];
echo $name;
?>
HTML
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
<!--
var request = false;
// Request senden
function setRequest(value) {
// Request erzeugen
if (window.XMLHttpRequest) {
request = new XMLHttpRequest(); // Mozilla, Safari, Opera
} else if (window.ActiveXObject) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP'); // IE 5
} catch (e) {
try {
request = new ActiveXObject('Microsoft.XMLHTTP'); // IE 6
} catch (e) {}
}
}
// überprüfen, ob Request erzeugt wurde
if (!request) {
alert("Kann keine XMLHTTP-Instanz erzeugen");
return false;
} else {
var url = "ajax_002.php";
// Request öffnen
request.open('post', url, true);
// Requestheader senden
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
// Request senden
request.send('name='+value);
// Request auswerten
request.onreadystatechange = interpretRequest;
}
}
// Request auswerten
function interpretRequest() {
switch (request.readyState) {
// wenn der readyState 4 und der request.status 200 ist, dann ist alles korrekt gelaufen
case 4:
if (request.status != 200) {
alert("Der Request wurde abgeschlossen, ist aber nicht OK\nFehler:"+request.status);
} else {
content = request.responseText;
// den Inhalt des Requests in das <div> schreiben
document.getElementById('content').innerHTML = content;
return content;
}
break;
default:
break;
}
}
//-->
</script>
<script>
window.onload = function () {
var limit = 1000; //increase number of dataPoints by increasing the limit
var y = 100; // hier einsetzen select * WHERE i=0 limit 1
var data = [];
var dataSeries = { type: "line" }; // in zeile 12 also +2 i= startwert/Wellenlänge setzen
var dataPoints = [];
for (var i = 0; i < limit; i += 1) {
setRequest(i);
y += Math.round(Math.random() * 10 - 5); //hier aus Datenbankentnehmen SELECT * WHERE lamda=i
dataPoints.push({
x: content,
y: y //aus php über mysql
});
}
dataSeries.dataPoints = dataPoints;
data.push(dataSeries);
//Better to construct options first and then pass it as a parameter
var options = {
zoomEnabled: true,
animationEnabled: true,
title: {
text: "Try Zooming - Panning"
},
axisY: {
includeZero: false
},
data: data // random data
};
$("#chartContainer").CanvasJSChart(options);
}
</script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
<script src="https://canvasjs.com/assets/script/jquery-1.11.1.min.js"></script>
<script src="https://canvasjs.com/assets/script/jquery.canvasjs.min.js"></script>
<br />
<div id="content"></div>
</body>
</html>
Alles anzeigen