My current project involves creating a graph using d3.js. I came across some php code that fits my needs perfectly. However, I am working with c# and Visual Studio, so I need to convert it into asp.net. For starters, I want to input some hardcoded sample data and generate an image using d3.js, along with incorporating JavaScript code from the php project. I now have a server-side web method that returns a JSON string. The parameter 'dataSample' is of type Dictionary and there are no errors in sight.
The backend code looks like this:
return JsonConvert.SerializeObject(dataSample);On the frontend, I am utilizing AJAX to fetch this data.
<script>
$.ajax({
type: 'POST',
url: 'Map.aspx/read_data',
contentType: 'application/json; charset=utf-8',
data: "{ }",
dataType: "json",
success: function(response) {
d3.json("", function (data) {
graph.data = response.d;
drawGraph();
});
},
error: function(error) {
console.log("Oops! Something went wrong!");
}
});
</script>The AJAX call is successful, and the Console log displays the graph.data obtained from the response:
{"DSO":{"name":"DSO","type":"group0","depends":["BPR","Transmission Company","Government"],"dependedOnBy":["TSO","Transmission Company"],"docs":""},"TSO":{"name":"TSO","type":"group1","depends":["BPR","DSO","Producer Secondary Energy","Government"],"dependedOnBy":["Producer Secondary Energy"],"docs":""}}Next, I aim to loop through each JSON object so that the drawGraph() function can create nodes for each one. For instance:
for (var name in graph.data) {
var obj = graph.data[name];
console.log("name: " + name + "object: " + obj);
}The issue arises when the console output does not display each object in the JSON correctly. Instead of individual objects, it seems to be looping through every letter.
The incorrect console log output can be viewed https://i.sstatic.net/fBDZK.png.
I'm striving to output the complete object instead of the current behavior.