jquery - d3 bar chart not rendering inside a partial view -


i trying render bar chart inside partial view in asp.net mvc application. when put code in html , put in project(not in view or folder, in root folder) , run html in browser, works fine. put html code in partial view , try render it, not render. following code

<script type="text/javascript" src="~/scripts/jquery-1.11.2.js"></script> <style>     .bar {         fill: steelblue;     }          .bar:hover {             fill: brown;         }      .axis {         font: 10px sans-serif;     }          .axis path,         .axis line {             fill: none;             stroke: #000;             shape-rendering: crispedges;         }      .x.axis path {         display: none;     } </style> <body>     <script src="~/scripts/d3.js"></script>     <script>          var margin = { top: 20, right: 20, bottom: 30, left: 40 },             width = 960 - margin.left - margin.right,             height = 500 - margin.top - margin.bottom;          var x = d3.scale.ordinal()             .rangeroundbands([0, width], .1);          var y = d3.scale.linear()             .range([height, 0]);          var xaxis = d3.svg.axis()             .scale(x)             .orient("bottom");          var yaxis = d3.svg.axis()             .scale(y)             .orient("left")             .ticks(10, "%");          var svg = d3.select("body").append("svg")             .attr("width", width + margin.left + margin.right)             .attr("height", height + margin.top + margin.bottom)           .append("g")             .attr("transform", "translate(" + margin.left + "," + margin.top + ")");          $.ajax({             url: 'http://localhost/abcd.portal/dashboard/getdata',             type: 'get',             data: '',             cache: false,             datatype: 'text',             async: true,             error: function (xhr) {                 //alert('error: ' + xhr.statustext);             },             success: function (result) {                 result = eval(json.parse(result));                 alert(result);                 x.domain(result.map(function (d) { return d.letter; }));                 y.domain([0, d3.max(result, function (d) { return d.frequency; })]);                  svg.append("g")                     .attr("class", "x axis")                     .attr("transform", "translate(0," + height + ")")                     .call(xaxis);                  svg.append("g")                     .attr("class", "y axis")                     .call(yaxis)                   .append("text")                     .attr("transform", "rotate(-90)")                     .attr("y", 6)                     .attr("dy", ".71em")                     .style("text-anchor", "end")                     .text("frequency");                  svg.selectall(".bar")                     .data(result)                   .enter().append("rect")                     .attr("class", "bar")                     .attr("x", function (d) { return x(d.letter); })                     .attr("width", x.rangeband())                     .attr("y", function (d) { return y(d.frequency); })                     .attr("height", function (d) { return height - y(d.frequency); });             }         });          function type(d) {             d.frequency = +d.frequency;             return d;         }      </script> </body>  

plus keep getting warning

synchronous xmlhttprequest on main thread deprecated because of detrimental effects end user's experience. more help, check http://xhr.spec.whatwg.org/. 

please help.


Comments

Popular posts from this blog

node.js - Mongoose: Cast to ObjectId failed for value on newly created object after setting the value -

[C++][SFML 2.2] Strange Performance Issues - Moving Mouse Lowers CPU Usage -

ios - Possible to get UIButton sizeThatFits to work? -