search

jiahuang / d3-timeline

Simple JS timeline plugin for d3
1.03k stars 282 forks source link

orient("top") causes an the axis labels to overlap #35

Open adinin opened 9 years ago

adinin commented 9 years ago

On one of the examples, if you change add the .orient("top") to the chart as such

 function timelineLabelColor() {
        var chart = d3.timeline()
          .beginning(1355752800000) // we can optionally add beginning and ending times to speed up rendering a little
          .ending(1355774400000)
          .stack() // toggles graph stacking
          .orient("top") // AS SUCH
          .margin({left:70, right:30, top:0, bottom:0})
          ;
        var svg = d3.select("#timeline6").append("svg").attr("width", width)
          .datum(labelColorTestData).call(chart);
      }

You end up with axis labels overlapping the chart content image

jiahuang commented 9 years ago

What's the expected behavior here? That there is more room on the bottom such that the axis does not overlap or that the axis gets moved above the graph?

Currently, the orient function is the same as d3's orient, which means it changes the orientation of the labels relative to the axis and not to the graph itself.

adinin commented 9 years ago

Honestly, I don't have context on this anymore, but I think most people would desire the labels to appear below the axis.

jiahuang commented 9 years ago

Isn't that what happens by default with orient = bottom?

Sorry it took me so long to reply to this :/