I have the following JavaScript code that uses the D3.js library to draw a tree (it follows the standard structure one can find in the various online tutorials):
<
You are missing the style for the node links. Something variation of this:
<style>
.link {
fill: none;
stroke: #ccc;
stroke-width: 4.5px;
}
</style>
Or, set it on the link itself:
.attr("d", diagonal).attr({ 'fill': 'none', 'stroke': 'grey', 'stroke-width': 4 });
It depends on odd vs. even number because by default a path gets no stroke and a fill color of black. So a straight line doesn't show up but the curved ones get filled.