fix categories labels y position

src/components/Timeline.jsx

@@ -275,6 +275,7 @@ class Timeline extends React.Component {
               />
               <Categories
                 dims={dims}
+                getCategoryY={this.state.scaleY}
                 onDragStart={() => { this.onDragStart() }}
                 onDrag={() => { this.onDrag() }}
                 onDragEnd={() => { this.onDragEnd() }}
@@ -290,10 +291,10 @@ class Timeline extends React.Component {
                 dims={dims}
                 onApplyZoom={this.onApplyZoom}
               />
-              <Labels
-                dims={dims}
-                timelabels={this.state.timerange}
-              />
+              {/* <Labels */}
+              {/*   dims={dims} */}
+              {/*   timelabels={this.state.timerange} */}
+              {/* /> */}
               <Markers
                 selected={this.props.app.selected}
                 getEventX={this.getDatetimeX}

src/components/TimelineCategories.jsx

@@ -24,14 +24,10 @@ class TimelineCategories extends React.Component {
     }
   }
 
-  getY(idx) {
-    return (idx + 1) * this.props.dims.trackHeight / this.props.categories.length + 7.5;
-  }
-
   renderCategory(category, idx) {
     const dims = this.props.dims;
     return (
-      <g class="tick" opacity="1" transform={`translate(0,${this.getY(idx)})`}>
+      <g class="tick" opacity="1" transform={`translate(0,${this.props.getCategoryY(category.category)})`}>
         <line x1={dims.margin_left} x2={dims.width - dims.width_controls}></line>
         <text x={dims.margin_left - 5} dy="0.32em">{category.category}</text>
       </g>

src/components/presentational/Timeline/Labels.js

@@ -22,21 +22,21 @@ const TimelineLabels = ({ dims, timelabels }) => {
         y2="20"
       >
       </line>
-      {/* <text */}
-      {/*   class="timeLabel0 timeLabel" */}
-      {/*   x="5" */}
-      {/*   y="15" */}
-      {/* > */}
-      {/*   {formatterWithYear(timelabels[0])} */}
-      {/* </text> */}
-      {/* <text */}
-      {/*   class="timelabelF timeLabel" */}
-      {/*   x={dims.width - dims.width_controls - 5} */}
-      {/*   y="15" */}
-      {/*   style={{ textAnchor: 'end' }} */}
-      {/* > */}
-      {/*   {formatterWithYear(timelabels[1])} */}
-      {/* </text> */}
+      <text
+        class="timeLabel0 timeLabel"
+        x="5"
+        y="15"
+      >
+        {formatterWithYear(timelabels[0])}
+      </text>
+      <text
+        class="timelabelF timeLabel"
+        x={dims.width - dims.width_controls - 5}
+        y="15"
+        style={{ textAnchor: 'end' }}
+      >
+        {formatterWithYear(timelabels[1])}
+      </text>
     </g>
   )
 }