0

I have a JSON string which is of the format

[{"A":"SomeStringData","B":1},
{"A":"SomeStringData","B":2},
...
...
...]
  1. Note that this passes fine through all json online parsers and is hence a valid JSON text.

  2. I'm trying to pass the data to create a chart using d3 and nv.d3. The snippet I'm using is as follows:

    var jsonString; nv.addGraph(function(){ var chart=nv.models.discreteBarChart().x(Something).y(Something); d3.select('#location').datum(jsonString).call(chart); return chart; });

  3. Note that Im passing the json text as it is to the datum() function. This does not work.

  4. I try json.parse(jsonString), and it doesn't work either
  5. I try eval, but it also doesn't help.

  6. I edit the json string to add a root node like so:

    [{values:[{"A1":"SomeStringData","A2":1}, {"B1":"SomeStringData","B2":2}, ... ... ...]}]

  7. The above returns an error through all online parsers.

  8. But, I'm able to get my chart using eval("("+jsonString+")") now.(JSON.parse() still doesn't work)

Now, my knowledgeable colleagues say eval() is dangerous and should be burnt at the stake. So, I'm guessing I should go for JSON.parse() which does not work.

Does anyone have any idea what I'm doing wrong with JSON.parse()? I'm new to JSON and its driving me insane.

If it helps, Im passing the json string as a string through an MVC controller:

Im using the following function obtained from here

public static class JSONHelper
    {
        public static string ToJSON(this object obj)
        {
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            return serializer.Serialize(obj);
        }

        public static string ToJSON(this object obj, int recursionDepth)
        {
            JavaScriptSerializer serializer = new JavaScriptSerializer();
            serializer.RecursionLimit = recursionDepth;
            return serializer.Serialize(obj);
        }
    }

The returned string is just passed through to the controller as a string variable. Nothing fancy there.

Community
  • 1
  • 1
Mkl Rjv
  • 6,815
  • 5
  • 29
  • 47
  • have u tried `JSON.stringify()` – HarshSharma Mar 05 '14 at 11:36
  • Actually, yes, in both scenarios, before and after editing JSON file. Didn't help. It was my understanding however, that stringify was meant to create a JSON text from a JS object and not the other way around. – Mkl Rjv Mar 05 '14 at 11:39
  • i think there is some problem with your json string it should in format like `A1:"SomeStringData",A2:"SomeNumericData"` – HarshSharma Mar 05 '14 at 11:41
  • I highly doubt it, since I didnt make it on my own. The JSON text was built by a JavaScriptSerializer class. Besides, the JSON tutorials at W3Schools mention the same format when dealing with numeric data. http://www.w3schools.com/json/json_intro.asp – Mkl Rjv Mar 05 '14 at 11:45
  • @HarshSharma his JSON is fine, keys in JSON require quotation marks. – eagerMoose Mar 05 '14 at 11:45
  • @eagerMoose yeah i also pointed out the quotation mark issue – HarshSharma Mar 05 '14 at 11:49
  • @HarshSharma it seems you're reading literally into his JSON. It's fine, as long as he replaces SomeNumericData with an actual number. However, you example puts A1 and A2 keys without quotations which is invalid JSON. Perhaps MklRjv should edit the original JSON example to make it valid so there's no room for misinterpretation. – eagerMoose Mar 05 '14 at 11:53
  • @eagerMoose: Done. Sorry for any misunderstandings the original might have caused. – Mkl Rjv Mar 05 '14 at 11:59

2 Answers2

1

The discrete bar char is expecting the same name for labels and values:

nv.addGraph(function() {  
  var chart = nv.models.discreteBarChart()
      .x(function(d) { return d.label })
      .y(function(d) { return d.value })
  ...
  ;

So, either incorporate the expected names in your data, as such:

historicalBarChart =
  [{
    key: "SomeKey",
    values:[
       { 
        "label":"SomeStringData",
       "value":100
    }, 
    {
      "label":"SomeStringData",
      "value":200
    }
    ]}
];

Or keep your names, but then change the code, making sure the names in the data are kept uniform.

FernOfTheAndes
  • 4,975
  • 2
  • 17
  • 25
0

I've tried the following in Chrome console.

var jsonString = '[{"A1": "SomeStringData","A2": 5},{"B1": "SomeStringData","B2": 14}]';
var jsonObject = JSON.parse(jsonString);
JSON.stringify(jsonObject);

which then outputs as expected

"[{"A1":"SomeStringData","A2":5},{"B1":"SomeStringData","B2":14}]"

What browser are you using? I can only assume this is either a browser bug, or you're not preparing the JSON string with apostrophes at the begining and the end.

eagerMoose
  • 1,123
  • 5
  • 13
  • 35
  • Actually, I'm passing the JSON text as a string from an MVC controller. I'm quite possibly wrong, but I'm guessing Javascript treats it as a string itself, because I can view the data through an alert. – Mkl Rjv Mar 05 '14 at 11:55
  • Can you post a snippet of code where you get jsonString from your MVC controller? – eagerMoose Mar 05 '14 at 11:58
  • Also, I'm using an up to date Chrome browser: Version 33.0.1750.146, if that helps. – Mkl Rjv Mar 05 '14 at 12:02
  • Sure, Code snippet posted. – Mkl Rjv Mar 05 '14 at 13:40
  • How are you fetching this String on the client side? It could be that the data type being returned is not recognized as String which could then create problems when using JSON.parse() – eagerMoose Mar 06 '14 at 07:57
  • Its via an ajax callback: Like @.ajax("URL",type:"POST",success:function(res){}) where res contains the JSON text which I am then passing to d3 – Mkl Rjv Mar 06 '14 at 10:36
  • I'm guessing you're using jQuery here. What happens if you add dataType: "json" to your $.ajax call? That way you wouldn't need JSON.parse() at all as you would be getting a JavaScript object already https://api.jquery.com/jQuery.ajax/ – eagerMoose Mar 06 '14 at 10:56
  • Tried that. For JSON to work, I removed the root attribute[{values:}] from my json text. Now, this accepts my JSON datatype and it is an object, but D3 doesnt accept this in my datum function, even if I use parse or stringify. – Mkl Rjv Mar 06 '14 at 11:59