PDA

View Full Version : Special characters in chart data



rjong
2 Sep 2010, 1:06 AM
While programming another ExtJs application I got some strange errors in FireBug while hovering data points in my line-chart. Every time I hovered over a point in a line serie I got 2 of the following errors:


missing : after property id
try { __flash__toXML(Ext.FlashEventPro... "<exception>" + e + "</exception>"; }
I figured out that this had something to do with my data:


var store = new Ext.data.JsonStore({
fields:[{"name":"name"},{"name":"Installed systems", type: "string"},{"name":"PV"}],
data: [
{"name":2010,"Installed systems":"31.00","PV":"0.03"},
{"name":2012,"Installed systems":"60000.00","PV":"0.05"},
{"name":2014,"Installed systems":"131000.00","PV":"0.08"},
{"name":2016,"Installed systems":"160000.00","PV":"0.10"},
{"name":2018,"Installed systems":"180000.00","PV":"0.15"},
{"name":2020,"Installed systems":"200000.00","PV":"0.30"}
]
});
The chart displays correct, however the space in 'Installed systems' causes errors on hover. When I remove the spaces the problem is solved, but this is not an ideal situation (I can imagine future series will also include brackets or comma's).

Is there a function that can handle special characters in this data?

I already found this thread, however did not managed to solve my problem with the suggested solutions:
http://www.sencha.com/forum/showthread.php?101361-OPEN-1039-JsonReader-bug-in-3.2.1-that-affects-Ext.data.ArrayStore&highlight=special+characters

Any help would be welcome :)

Condor
2 Sep 2010, 1:14 AM
Why not use:

{name: 'Installed_systems', mapping: 'Installed systems', type: 'string'}

(preferably the name should be a valid javascript identifier, but the mapping can be anything you like)

rjong
2 Sep 2010, 1:39 AM
Thanks for the quick answer!

It does help do prevent the error. I now made a function that replaces all kinds of special characters with an underscore, not a really neat function but it works.

Keep up the good work :)