Ошибка разбора строки JSON с использованием parseJSON
Нужна помощь, если есть проблема с кодом или самими данными. Хотя я подозреваю, что это с кодом, потому что я пытался проверить данные JSON, которые я получил, они правильно отформатированы...
Вот мои данные JSON
{"view":"cities","model":{"top10Cities":[{"id":1024,"name":"Mumbai (Bombay)","countrycode":"IND","district":"Maharashtra","population":"10500000"},{"id":2331,"name":"Seoul","countrycode":"KOR","district":"Seoul","population":"9981619"},{"id":206,"name":"São Paulo","countrycode":"BRA","district":"São Paulo","population":"9968485"},{"id":1890,"name":"Shanghai","countrycode":"CHN","district":"Shanghai","population":"9696300"},{"id":939,"name":"Jakarta","countrycode":"IDN","district":"Jakarta Raya","population":"9604900"},{"id":2822,"name":"Karachi","countrycode":"PAK","district":"Sindh","population":"9269265"},{"id":3357,"name":"Istanbul","countrycode":"TUR","district":"Istanbul","population":"8787958"},{"id":2515,"name":"Ciudad de México","countrycode":"MEX","district":"Distrito Federal","population":"8591309"},{"id":3580,"name":"Moscow","countrycode":"RUS","district":"Moscow (City)","population":"8389200"},{"id":3793,"name":"New York","countrycode":"USA","district":"New York","population":"8008278"}],"fusionCharts":{"chart":"{\"showValues\":\"0\",\"caption\":\"Cities by Country Code\",\"theme\":\"zune\"}","data":"[{\"label\":\"Mumbai (Bombay)\",\"value\":\"10500000\"},{\"label\":\"Seoul\",\"value\":\"9981619\"},{\"label\":\"São Paulo\",\"value\":\"9968485\"},{\"label\":\"Shanghai\",\"value\":\"9696300\"},{\"label\":\"Jakarta\",\"value\":\"9604900\"},{\"label\":\"Karachi\",\"value\":\"9269265\"},{\"label\":\"Istanbul\",\"value\":\"8787958\"},{\"label\":\"Ciudad de México\",\"value\":\"8591309\"},{\"label\":\"Moscow\",\"value\":\"8389200\"},{\"label\":\"New York\",\"value\":\"8008278\"}]"}},"cleared":false}
Вот код, который я использовал для получения данных JSON
$(document).ready( function () {
var jsonD = $.getJSON("http://localhost:8080/v1/cityData", function ( data ) {
console.log("Success "+ data.toString());
alert(data);
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSONURL",
dataSource: data
});
})
});
Я попробовал советы, изложенные в этой статье, но они все еще не работают. Любой совет, как это исправить? Спасибо
Обновление 2
измененный код jquery, предложенный Nisanth, но библиотека диаграмм все еще не работает. Это говорит о недопустимых данных, может быть, это проблема самой библиотеки Fusion Charts?
$(document).ready( function () {
var jsonD = {};
$.getJSON("http://localhost:8080/v1/cityData", function ( data ) {
console.log("Success ");
alert(data);
jsonD = data;
}).done( function () {
var fcData = JSON.stringify(jsonD);
console.log("fcData: "+fcData);
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSON",
dataSource: fcData
});
});
});
Код работает нормально. Я добавил журнал в функцию.done, и он показал значение fcData, см. Ниже.
Изменил fcData = jsonD.model.fusionCharts и получил ошибку ниже.
Uncaught TypeError: b.match is not a function
at Fb (fusioncharts.js:214)
at constructor._drawCategory (fusioncharts.js:1263)
at constructor._drawComponents (fusioncharts.js:1223)
at constructor.draw (fusioncharts.js:1220)
at k._drawAxis (fusioncharts.js:981)
at k._updateVisuals (fusioncharts.js:976)
at k.draw (fusioncharts.js:979)
at k.init (fusioncharts.js:946)
at Object.m.createChart (fusioncharts.js:875)
at n.core.render (fusioncharts.js:1801)
Обновление 3
Обновление кода
}).done( function () {
var cfChart= jsonD.model.fusionCharts.chart;
var cfData= jsonD.model.fusionCharts.chart;
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSON",
dataSource: {chart:cfChart,data:cfData}
});
});
});
Журнал ошибок
Uncaught TypeError: b.match is not a function
at Fb (fusioncharts.js:214)
at constructor._drawCategory (fusioncharts.js:1263)
at constructor._drawComponents (fusioncharts.js:1223)
at constructor.draw (fusioncharts.js:1220)
at k._drawAxis (fusioncharts.js:981)
at k._updateVisuals (fusioncharts.js:976)
at k.draw (fusioncharts.js:979)
at k.init (fusioncharts.js:946)
at Object.m.createChart (fusioncharts.js:875)
at n.core.render (fusioncharts.js:1801)
Рабочий код
$(document).ready( function () {
var jsonD = {};
$.getJSON("http://localhost:8080/v1/cityData", function ( data ) {
console.log("Success ");
//alert(data);
jsonD = data;
}).done( function () {
var cfChart= JSON.parse(jsonD.model.fusionCharts.chart);
var cfData= JSON.parse(jsonD.model.fusionCharts.data);
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSON",
dataSource: {chart:cfChart,data:cfData}
});
});
});
1 ответ
Как @nnnnnn, упомянутый в его комментарии... $.getJSON не возвращает json, Это всегда возвращает Deferred Object,
Если вы хотите использовать data из $.getJSON Успешную функцию вы могли бы сделать:
//declaring in global scope
var jsonD={};
$.getJSON("http://localhost:8080/v1/cityData", function ( data ) {
console.log("Success");
alert(data);
//changing the value in local scope
jsonD = data;
}).done(function(){
var fcData = jsonD.model.fusionCharts;
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSON",
dataSource: fcData
});
})
РЕДАКТИРОВАТЬ
После проверки вашего json данные, которые я вижу, данные не извлекаются должным образом. FusionCharts ожидать, что данные JSON будут иметь chart а также data ключи. Эти данные присутствуют в вашем JSON внутри data.model.fusionCharts как string
Итак, вы должны сначала extract затем они разбирают json а затем поставьте его на ваш dataSource,
Итак, ты актуален fusionChart настроить будет что-то вроде:
.done(function(){
var cfChart= JSON.parse(jsonD.model.fusionCharts.chart);
var cfData= JSON.parse(jsonD.model.fusionCharts.data);
$("#fChart").insertFusionCharts({
type: "column2d",
width: "450",
height: "250",
dateFormat: "JSON",
dataSource: {chart:cfChart,data:cfData}
});
})