DaveGecko07

JavaScript render errors with JSON

Recommended Posts

Hello, I have a MSLine chart using validated JSON. This works fine using the flash but when I try to render it in javascript it errors.

 

If I use

myChart.setJSONUrl("ReceiptsMSLine.json");

I get invalid data error

 

If i use

myChart.setJSONData('MyJson');

I get the error:

 

Line: 15
Error: Unable to get value of the property 'split': object is null or undefined

 

Any help would be greatly appreciated.

 

code is below:

 

<!DOCTYPE html>

<html>

 

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 

<title>Financial Chart</title>

 

<script src="../../Charts/FusionCharts_EnterpriseEx/Charts/FusionCharts.js" type="text/javascript"></script>

<script src="../../Charts/FusionCharts_EnterpriseEx/Charts/jquery.min.js" type="text/javascript"></script>

<script src="../../Charts/FusionCharts_EnterpriseEx/Charts/highcharts.js" type="text/javascript"></script>

 

 

</head>

<body>

 

<div id="wrapper">

 

 

<div id="chartContainer">FusionCharts will load here</div>

 

<script type="text/javascript"><!--

FusionCharts.setCurrentRenderer('javascript');

 

var myChart = new FusionCharts("../../Charts/FusionCharts_EnterpriseEx/Charts/MSLine.swf", "ChartId", "800", "500", "0", "0");

 

//myChart.setJSONUrl("ReceiptsMSLine.json");

 

myChart.setJSONData('{"chart":{ "caption":"Receipts - cumulative", "xaxisname":"Month", "yaxisname":"Receipts £", "showvalues":"0", "numberprefix": "%A3", "bgColor":"ffffff", "showBorder":"0","numVDivLines":"10","reverseLegend":"1"},"categories":[{"category":[{"label":"Apr"},{"label":"May"},{"label":"Jun"},{"label":"Jul"},{"label":"Aug"},{"label":"Sep"},{"label":"Oct"},{"label":"Nov"},{"label":"Dec"},{"label":"Jan"},{"label":"Feb"},{"label":"Mar"}]}],"dataset":[{"seriesname":"Monthly Plan","color": "af292e","data":[{"value":"9378010"},{"value":"71026533"},{"value":"90101266"},{"value":"97825351"},{"value":"103616222"},{"value":"117813441"},{"value":"128052071"},{"value":"136053732"},{"value":"149482740"},{"value":"156552766"},{"value":"162577528"},{"value":"313978555"}]},{"seriesname":"DEL Forecast","color":"00857e","dashed":"1","data":[{"value":""},{"value":""},{"value":""},{"value":""},{"value":""},{"value":""},{"value":""},{"value":""},{"value":"211006263"},{"value":"230506969"},{"value":"247861703"},{"value":"324894030"}]},{"seriesname":"Actual YTD","color":"00857e","data":[{"value":"8305075"},{"value":"69262137"},{"value":"84307885"},{"value":"99994631"},{"value":"119527041"},{"value":"142661942"},{"value":"160449790"},{"value":"180489689"},{"value":"211006263"},{"value":""},{"value":""},{"value":""}]}],"styles":[{"definition":[{"style":[{"name":"CanvasAnim","type":"animation","param":"_xScale","start":"0","duration":"1"}]}],"application":[{"apply":[{"toobject":"Canvas","styles":"CanvasAnim"}]}]}]}');

 

myChart.render("chartContainer" );

 

</script>

</div>

</body>

</html>

Share this post


Link to post
Share on other sites
Guest Sashibhusan

Hi,

 

Please find the working sample (as attachment) of your code implementation, which is working fine from our end.

 

Please note that many browsers restrict JavaScript from accessing local file system owing to security reasons. The JavaScript charts, when running locally, will not be able to access data provided as a URL.

 

If you run the files from a server, it will run absolutely fine, though. When running locally, however, if you provide the data as string (using the Data String method), it works fine.

 

Hope this helps!

JSON_Sample.zip

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now