Question

我的php生成的Json文件如下所示：

 [ { "category": "2015-07-02 20:13:58", "value1": 30.500, "value2": 30.500 }, { "category": "2015-07-02 20:14:59", "value1": 29.750, "value2": 29.750 }, { "category": "2015-07-02 20:16:01", "value1": 29.125, "value2": 29.125 }, { "category": "2015-07-02 20:17:03", "value1": 28.625, "value2": 28.625 }, { "category": "2015-07-02 20:18:04", "value1": 28.125, "value2": 28.125 } ]

我的amcharts文件是这样的：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>amCharts tutorial: Loading external data</title>
</head>
<body>

<!-- prerequisites -->
<link rel="stylesheet" href="http://www.amcharts.com/lib/style.css"  
type="text/css">
<script src="http://www.amcharts.com/lib/3/amcharts.js" 
type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/serial.js"    
type="text/javascript"> 
</script>

<!-- cutom functions -->
<script>
AmCharts.loadJSON = function(url) {
// create the request
if (window.XMLHttpRequest) {
// IE7+, Firefox, Chrome, Opera, Safari
var request = new XMLHttpRequest();
} else {
// code for IE6, IE5
var request = new ActiveXObject('Microsoft.XMLHTTP');
}

// load it
// the last "false" parameter ensures that our code will wait before the
// data is loaded
request.open('GET', url, true);
request.send();

// parse adn return the output
return eval(request.responseText);
};
</script>

<!-- chart container -->
<div id="chartdiv" style="width: 600px; height: 300px;"></div>

<!-- the chart code -->
<script>
var chart;

 // create chart
 AmCharts.ready(function() {

// load the data
var chartData = AmCharts.loadJSON('data.php');

// SERIAL CHART
chart = new AmCharts.AmSerialChart();
chart.pathToImages = "http://www.amcharts.com/lib/images/";
chart.dataProvider = chartData;
chart.categoryField = "category";
chart.dataDateFormat = "YYYY-MM-DD JJ:NN:SS";

// GRAPHS

var graph1 = new AmCharts.AmGraph();
graph1.valueField = "value1";
graph1.bullet = "round";
graph1.bulletBorderColor = "#FFFFFF";
graph1.bulletBorderThickness = 2;
graph1.lineThickness = 2;
graph1.lineAlpha = 0.5;
chart.addGraph(graph1);

var graph2 = new AmCharts.AmGraph();
graph2.valueField = "value2";
graph2.bullet = "round";
graph2.bulletBorderColor = "#FFFFFF";
graph2.bulletBorderThickness = 2;
graph2.lineThickness = 2;
graph2.lineAlpha = 0.5;
chart.addGraph(graph2);

// CATEGORY AXIS
chart.categoryAxis.parseDates = true;

// WRITE
chart.write("chartdiv");
});

 </script>

</body>
</html>

不幸的是我没有图表，请看这里：http://bitfreun.de/index.html 我只能在chrome开发者控制台中看到一条消息： “onResRdy中的异常：TypeError：无法读取未定义的属性'htmlRes'”

Answer 1

问题是你的要求。
当你打开它时，你将async设置为true。这会导致'loadJSON'函数返回undefined，因为当您要求request.responseText时未返回响应。
结果是，图表的dataProvider是undefined因此您的图表不起作用。

要解决此问题，请使用
request.open('GET', url, FALSE);
或者使用onreadystatechange作为响应，然后重新绘制图表。

Answer 2

我在第一行发现错误，我的意思是你的 JSON格式，根据我的经验，您不能在结果字符串中使用":"，对于Eg，

2015-07-02 20:13:58

此时当您将 20:13:58 置于数据提供程序时无法识别，那么如何处理它，尝试从此JSON字符串中删除: ，这应该有用。

Amcharts json，没有图表

2 个答案: