Hi I'm learning how to work with protovis, so far so good, but now I stumbled upon a problem I can't seem to solve.
你好,我正在学习如何与神族合作,到目前为止还不错,但是现在我偶然发现了一个我似乎无法解决的问题。
The following is the code. (I have the latest jquery loaded in my headers)
下面是代码。(我在我的标题中装载了最新的jquery)
<script type="text/javascript+protovis">
var dataURL = "http://eagereyes.org/media/2010/protovis-primer/earthquakes.json";
var JSONdata = $.ajax({ type: "GET", url: dataURL, async: false }).responseText;
var earthquakes = JSON.parse(JSONdata);
var width = 560;
var height = 245;
var barWidth = width/earthquakes.length;
var gap = 2;
new pv.Panel().width(width).height(height+5)
.add(pv.Bar)
.data(earthquakes)
.bottom(0)
.width(barWidth-gap)
.height(function(d) d.Magnitude * (height/9))
.left(function() this.index * barWidth)
.root.render();
When I try this in Firefox i get this alert:
当我在Firefox中尝试这个时,我得到了这个警告:
Syntax:Error JSON.parse
I have validated the JSON on http://www.jsonlint.com/ already. So the problem must be elsewhere.
我已经在http://www.jsonlint.com/上验证了JSON。所以问题一定在别处。
Anyone knows whats going on here?
有人知道这是怎么回事吗?
Edit
编辑
I tried loading the same data in the protoviewer app: http://www.rioleo.org/protoviewer/ and it works. So it must be the code.
我尝试在protoviewer应用程序中加载相同的数据:http://www.rioleo.org/protoviewer/,它是有效的。所以一定是代码。
4 个解决方案
#1
2
Have you tried a regular async callback instead of the synchronous approach? Like:
您尝试过常规异步回调而不是同步方法吗?如:
var dataURL = "http://eagereyes.org/media/2010/protovis-primer/earthquakes.json";
$.ajax({
type: "GET",
url: dataURL,
success: function(response) {
var earthquakes = JSON.parse(JSONdata);
var width = 560;
var height = 245;
var barWidth = width/earthquakes.length;
var gap = 2;
new pv.Panel().width(width).height(height+5)
.add(pv.Bar)
.data(earthquakes)
.bottom(0)
.width(barWidth-gap)
.height(function(d) d.Magnitude * (height/9))
.left(function() this.index * barWidth)
.root.render();
}
});
Also, is that JSON file located on the same server that the page making the request shows in the address bar (exactly http://eagereyes.org
)?
同样,位于发出请求的页面在地址栏(恰好是http://eagereyes.org)中显示的同一台服务器上的JSON文件吗?
Finally, the manual JSON.parse() step isn't necessary. If you add the dataType: 'json'
parameter, $.ajax() will automatically deserialize as JSON and uses JSON.parse() where available.
最后,不需要手动的JSON.parse()步骤。如果您添加了dataType: 'json'参数,$.ajax()将自动反序列化为json,并在可用的地方使用json .parse()。
#2
0
Add a semi-colon ;
to the end of your response
添加一个分号;在你回答的最后
#3
0
Which browser are you using? Some browsers don't define the JSON
object. You can download a script from the URL below which will define the JSON
object if it doesn't already exist.
你用的是哪个浏览器?有些浏览器不定义JSON对象。您可以从下面的URL下载一个脚本,如果JSON对象还不存在,该脚本将定义该对象。
https://github.com/douglascrockford/JSON-js
https://github.com/douglascrockford/JSON-js
You can check whether JSON
is defined as follows:
您可以检查JSON是否定义如下:
alert(JSON);
update
更新
OK next thing I'd do is check that the ajax call is actually returning the corect data. Change your code to print the JSON returned from the ajax call.
接下来我要做的是检查ajax调用是否实际返回了corect数据。更改代码以打印ajax调用返回的JSON。
var JSONdata = $.ajax({ type: "GET", url: dataURL, async: false }).responseText;
alert(JSONdata);
var earthquakes = JSON.parse(JSONdata);
#4
0
$.ajax({
type: "POST",
url: "saveChangesInEditing.php",
data: idObject,
success: function(data){
dataObject = JSON.parse(data);
$("input[name = 'id']").val(dataObject.id);
$("input[name='full_name']").val(dataObject.full_name);
$("input[name='sport']").val(dataObject.sport);
$("input[name='idol']").val(dataObject.idol);
},
error: function(data){
alert("error!" + data);
}
});
#1
2
Have you tried a regular async callback instead of the synchronous approach? Like:
您尝试过常规异步回调而不是同步方法吗?如:
var dataURL = "http://eagereyes.org/media/2010/protovis-primer/earthquakes.json";
$.ajax({
type: "GET",
url: dataURL,
success: function(response) {
var earthquakes = JSON.parse(JSONdata);
var width = 560;
var height = 245;
var barWidth = width/earthquakes.length;
var gap = 2;
new pv.Panel().width(width).height(height+5)
.add(pv.Bar)
.data(earthquakes)
.bottom(0)
.width(barWidth-gap)
.height(function(d) d.Magnitude * (height/9))
.left(function() this.index * barWidth)
.root.render();
}
});
Also, is that JSON file located on the same server that the page making the request shows in the address bar (exactly http://eagereyes.org
)?
同样,位于发出请求的页面在地址栏(恰好是http://eagereyes.org)中显示的同一台服务器上的JSON文件吗?
Finally, the manual JSON.parse() step isn't necessary. If you add the dataType: 'json'
parameter, $.ajax() will automatically deserialize as JSON and uses JSON.parse() where available.
最后,不需要手动的JSON.parse()步骤。如果您添加了dataType: 'json'参数,$.ajax()将自动反序列化为json,并在可用的地方使用json .parse()。
#2
0
Add a semi-colon ;
to the end of your response
添加一个分号;在你回答的最后
#3
0
Which browser are you using? Some browsers don't define the JSON
object. You can download a script from the URL below which will define the JSON
object if it doesn't already exist.
你用的是哪个浏览器?有些浏览器不定义JSON对象。您可以从下面的URL下载一个脚本,如果JSON对象还不存在,该脚本将定义该对象。
https://github.com/douglascrockford/JSON-js
https://github.com/douglascrockford/JSON-js
You can check whether JSON
is defined as follows:
您可以检查JSON是否定义如下:
alert(JSON);
update
更新
OK next thing I'd do is check that the ajax call is actually returning the corect data. Change your code to print the JSON returned from the ajax call.
接下来我要做的是检查ajax调用是否实际返回了corect数据。更改代码以打印ajax调用返回的JSON。
var JSONdata = $.ajax({ type: "GET", url: dataURL, async: false }).responseText;
alert(JSONdata);
var earthquakes = JSON.parse(JSONdata);
#4
0
$.ajax({
type: "POST",
url: "saveChangesInEditing.php",
data: idObject,
success: function(data){
dataObject = JSON.parse(data);
$("input[name = 'id']").val(dataObject.id);
$("input[name='full_name']").val(dataObject.full_name);
$("input[name='sport']").val(dataObject.sport);
$("input[name='idol']").val(dataObject.idol);
},
error: function(data){
alert("error!" + data);
}
});