search

jiahuang / d3-timeline

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

Label alignment #74

Closed martinwi closed 8 years ago

martinwi commented 8 years ago

The labels don't appear to move with a change to the top margin.

Not familiar with pulling/amending/adding code here, so here's a suggestion to keep the label aligned with the bar.

I have amended the "var rowsDown" line. 

var appendLabel = function (gParent, yAxisMapping, index, hasLabel, datum) {
  var fullItemHeight    = itemHeight + itemMargin;
  var rowsDown          =  margin.top + (fullItemHeight/2) + fullItemHeight * (yAxisMapping[index] || 1);

  gParent.append("text")
    .attr("class", "timeline-label")
    .attr("transform", "translate(" + labelMargin + "," + rowsDown + ")")
    .text(hasLabel ? labelFunction(datum.label) : datum.id)
    .on("click", function (d, i) { click(d, index, datum); });
};
pcyr commented 8 years ago

+1, I noticed the same problem and checked issues before starting a fix. Thanks!