CODEWITHSUNDEEP
google-chromed3.jssapui5
Neil Ward
Neil Ward

Reputation: 31

D3.js Error: <rect> attribute width: A negative value is not valid. (only happens in Chrome)

I have built an App in SAPUI5 with 2 custom d3.js controls (charts) on 2 separate pages/panels and I have a strange problem that only manifests itself in Chrome. it's kinda hard to explain.

When I close a page in my app, I get this error "Error: attribute width: A negative value is not valid. ("-100")" in the console and then, the Rects on my other chart disappear!

to try and better explain, some screenshots... the user displays the pages which contain both charts both charts displayed

then the user closes the page on the right and only one of the charts is left displayed... at this point, the error appears in the console right page closed

finally the user changes focus by clicking on the list on the left hand page, and then the rects on the chart disappear! where'd my rects go?!?

what I have determined is that the error is occurring in the code for the chart on the right and it's occurring once the panel which contains that chart is closed.

            g.append("rect") // red
            .style("filter", "url(#drop-shadow)")
            .attr("x", 0) 
            .attr("y", 0) 
            .attr("rx", 6)
            .attr("ry", 6)
            .attr("width", width) // <-- this is where the error occurs
            .attr("height", height * red)
            .attr("fill", "#ca0101"); // full height

if this is correct or not I'm not sure, since the page has been closed, the width is technically non existent, Firefox and Edge seem to ignore this issue and no errors are shown in the console and the rects do not disappear, it only happens in Chrome... is this a bug with d3 and chrome perhaps?

Upvotes: 1

Views: 8502

Answers (2)

rahman
rahman

Reputation: 111

in my case, it solved with a Timeout !

 var results = getMyData();
 setTimeout(function () {
     _lineChart = new lineChart(chartDiv);
     _lineChart.update(results);
 }, 300);

Upvotes: 0

Neil Ward
Neil Ward

Reputation: 31

This morning I deployed the App to my SAP Fiori Front End Server, regardless of the "bug". and guess what, it works! what this tells me is the bug was somewhere between Chrome and SAPs WebIDE Fiori LaunchPad sandbox... nothing to do with my code..... happy days :)

Upvotes: 2

Related Questions