有一些问题让它在 IE 中工作。我基本上从 MySQL 数据库中提取一些列来为此 jscript 代码生成动态值。它似乎在 Firefox 等中运行良好,但在 IE 中不行。检查语法,寻找额外的逗号或 IE 可能不喜欢的不友好的额外内容,在这里旋转我的轮子......这是代码,提前谢谢:
<script src="jquery-1.7.2.min.js"></script>
<script>
var graph;
var xPadding = 45;
var yPadding = 45;
var data = { values:[
<?php
include("mysqlconn.php");
$result = mysql_query("SELECT DISTINCT kioskName FROM tbllogs ORDER BY kioskName ASC");
while($row = mysql_fetch_array($result)) {
$kioskname = $row['kioskName'];
$result1 = mysql_query("SELECT kioskName FROM tbllogs WHERE kioskName = '$kioskname'");
$numrows1 = mysql_num_rows($result1);
if($numrows1!=0) { ?>
{ X: "<?php echo $kioskname; ?>", Y: <?php echo $numrows1; ?> },
<?php } else { ?>
{ X: "<?php echo $kioskname; ?>", Y: 0 },
<?php }
}
?>
]};
// Returns the max Y value in our data list
function getMaxY() {
var max = 0;
for(var i = 0; i < data.values.length; i ++) {
if(data.values[i].Y > max) {
max = data.values[i].Y;
}
}
max += 10 - max % 10;
return max;
}
// Return the x pixel for a graph point
function getXPixel(val) {
return ((graph.width() - xPadding) / data.values.length) * val + (xPadding * 1.5);
}
// Return the y pixel for a graph point
function getYPixel(val) {
return graph.height() - (((graph.height() - yPadding) / getMaxY()) * val) - yPadding;
}
$(document).ready(function() {
graph = $('#graph');
var c = graph[0].getContext('2d');
c.lineWidth = 2;
c.strokeStyle = '#333';
c.font = 'italic 8pt sans-serif';
c.textAlign = "center";
// Draw the axises
c.beginPath();
c.moveTo(xPadding, 0);
c.lineTo(xPadding, graph.height() - yPadding);
c.lineTo(graph.width(), graph.height() - yPadding);
c.stroke();
// Draw the X value texts
for(var i = 0; i < data.values.length; i ++) {
c.fillText(data.values[i].X, getXPixel(i), graph.height() - yPadding + 20);
}
// Draw the Y value texts
c.textAlign = "right";
c.textBaseline = "middle";
for(var i = 0; i < getMaxY(); i += 10) {
c.fillText(i, xPadding - 10, getYPixel(i));
}
c.strokeStyle = '#f00';
// Draw the line graph
c.beginPath();
c.moveTo(getXPixel(0), getYPixel(data.values[0].Y));
for(var i = 1; i < data.values.length; i ++) {
c.lineTo(getXPixel(i), getYPixel(data.values[i].Y));
}
c.stroke();
// Draw the dots
c.fillStyle = '#333';
for(var i = 0; i < data.values.length; i ++) {
c.beginPath();
c.arc(getXPixel(i), getYPixel(data.values[i].Y), 4, 0, Math.PI * 2, true);
c.fill();
}
});
</script>
有什么想法吗?