CODEWITHSUNDEEP
jsonhtmlasp.net-mvc-4nvd3.js
Pandiyan Cool
Pandiyan Cool

Reputation: 6575

How to feed json data to nvd3 graph code

I'm new to mvc codes. In my mvc project i'm plotting a graph using NVD3 tool. In my Controller i generated the json and load it into following variable

        ViewData["ChartData"] = Json(ChartData).Data;

Now i have to pass this json data to my view and load into my nvd3 code.

The following is my view code

 <script type="text/javascript">
 var data=[
 {
    color:"#660066",
    values: /* here i have to load my json data*/
 }];

var chart;
nv.addGraph(function () {
var chart = nv.models.multiBarHorizontalChart()
.x(function (d) { return d.Label })
.y(function (d) { return d.Value })

.tickFormat(d3.format(','));

    d3.select('#chart svg')
.datum(data)
.transition().duration(500)
.call(chart);

    nv.utils.windowResize(chart.update);
    return chart;
});

</script>

In the above code i have load json data like this example:

 var data=[
 {
    color:"#660066",
    values: [{name:"Analyst",value:25},{name:"Technician",value:75}]
 }];

Upvotes: 2

Views: 3123

Answers (1)

backtrack
backtrack

Reputation: 8154

I think so ... this will be helpful

  var feedData = @Html.Raw(Json.Encode(ViewData["chartdata"]));
  var data=[{values: feedData}];

Try this and let me know if there any problem

Upvotes: 1

Related Questions