d3.js - Error: Invalid value for <g> attribute transform="translate(0,NaN)" -


problem chart on d3. getting above error message working fine dummy data, when use our end data several errors. able fix of it. current code. here codepen.actual data just alot less views getting broken along way. if date/value 0;

        function viewsprogresschart() {          var viewswidgetwidth = $('.viewswidget .thumbnail').width();         var viewswidgetheight = $('.calendarwidget .thumbnail').height() - 90;         var fontsize = (math.min(width, height) / 4);          var margin = {                 top: 2,                 right: 15,                 bottom: 15,                 left: 18             },             width = viewswidgetwidth - margin.left - margin.right,             height = viewswidgetheight - margin.top - margin.bottom,             dateline = height - 20;          var data = phpweeklyview.map(function(elem, index) {             return {                 date: new date(elem.date),                 close: elem.view_count             };         });           var formatpercent = d3.format("+%"),             formatchange = function(x) {                 return formatpercent(x - 1);             },             // parsedate = d3.time.format('%y-%m-%d').parse;             parsedate = d3.time.format('%d-%b-%y');          var x = d3.time.scale()             .range([0, width]);          var y = d3.scale.log()             .range([height, 0]);          var xaxis = d3.svg.axis()             .scale(x)             .orient("bottom");          var yaxis = d3.svg.axis()             .scale(y)             .orient("left")             .ticksize(-width, 0)             .tickformat(formatchange);          var line = d3.svg.line()             .x(function(d) {                 return x(d.date);             })             .y(function(d) {                 return y(d.ratio);             });          var svg = d3.select(".viewswidget div.row").append("svg")             .attr("width", "100%")             .attr('preserveaspectratio', 'xminymin')             .attr("height", height + 22)             .attr('preserveaspectratio', 'xminymin')             .append("g")             .attr("transform", "translate(" + margin.left + "," + margin.top + ")");          var gx = svg.append("g")             .attr("class", "axis axis--x")             .attr('viewbox', '0 0 ' + math.min(width, height) + ' ' + math.min(width, height))             .attr('preserveaspectratio', 'xminymin')             .attr("transform", "translate(0," + dateline + ")");          var gy = svg.append("g")             .attr("class", "axis axis--y");          gy.append("text")             .attr("class", "axis-title")             .attr('viewbox', '0 0 ' + math.min(width, height) + ' ' + math.min(width, height))             .attr('preserveaspectratio', 'xminymin')             .attr("transform", "rotate(-90)")             .attr("y", 6)             .attr("dy", ".71em")             .text("change in views");          // compute views relative base value.         var basevalue = +data[0].close;         data.foreach(function(d) {             // if(d.close != 0){             //     basevalue = +d.close;             // }             d.date = parsedate(d.date);             d.ratio = d.close / basevalue;         });          x.domain(d3.extent(data, function(d) {             return d.date;         }));         y.domain(d3.extent(data, function(d) {             return d.ratio;         }));          // use second linear scale ticks.         yaxis.tickvalues(d3.scale.linear()             .domain(y.domain())             .ticks(30));          gx.call(xaxis);          gy.call(yaxis)             .selectall(".tick")             .classed("tick--one", function(d) {                 return math.abs(d - 1) < 1e-6;             });          svg.append("path") //had .datum(data) here giving error before dummy data worked fine.             .data(data)             .attr("class", "line")             .attr("d", line);     } 


Comments

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -