How to debug D3.js using Firefox

[Kenneth Zhang]

I am relatively new to D3.js and I am running it with Firefox on
Linux. I had a hard time debugging my code. Many times I couldn't get
the right figure, but there is no error shown in the Error Console. I
have tried Firebug and found that not all the code is shown in the
console.

Could someone please advise what is an efficient way to debug D3.js?
Thanks in advance!

[Nelson]

Hey Kenneth,

I would recommend you installing the Firefox Plugin "Firebug" and
using the
built in console.log("hello world") function, to log your variables
and objects.

Best Nelson

[Ian Johnson]

One thing that helps is to inspect the DOM elements with Firebug. Perhaps you appended some elements (like a <rect>) but somehow you didn't bind the data properly, or you appended the elements and messed up the attributes. These things can go wrong without showing any errors (because the code still executes properly, it's just not what you expected). So to get a better idea if the code matches your expectations you can see if the proper elements show up in the page.

--
Ian Johnson

http://enja.org

[Nelson]

Sorry I missed your last sentence :)

Can you give a specific example? Something which doesn"t show up?

[Kenneth Zhang]

Thank you Nelson for your kind help - now the Firebug works fine! It really saves me a lot of time.

[Kenneth Zhang]

Thank you Ian for your kind suggestion - it works now!