chromosome-rule.ts 1.95 KB
Newer Older
Remi  PLANEL's avatar
Remi PLANEL committed
1
2
3
4
import { axisTop } from "d3-axis";
import { Selection, select } from "d3-selection";
import { scaleLinear, ScaleLinear } from "d3-scale";
import { format } from "d3-format";
5
6
import { GenericAxisData } from "../../types";

Remi  PLANEL's avatar
Remi PLANEL committed
7
8
9
10

export default function () {
  let xScale = scaleLinear()
    .domain([0, 0])
11
12
    .range([0, 0])

Remi  PLANEL's avatar
Remi PLANEL committed
13
  function genomeAxis(
14
    _selection: Selection<SVGElement, GenericAxisData, SVGElement, any>,
Remi  PLANEL's avatar
Remi PLANEL committed
15
16
17
18
    width: number,
    yPosition: number = 0
  ) {

19
    _selection.each(function (_data) {
Remi  PLANEL's avatar
Remi PLANEL committed
20
21
22
23
      const container = select(this)
        .attr("transform", "translate(0," + yPosition + ")");

      xScale = scaleLinear()
24
        .domain(_data.interval)
Remi  PLANEL's avatar
Remi PLANEL committed
25
26
27
28
29
30
        .range([0, width])

      const genomeAxisComponent = axisTop(xScale)
        .tickFormat(format(".3s"));

      const genomeAxisSelection = container
31
        .selectAll<SVGElement, GenericAxisData>("g.genome-axis")
Remi  PLANEL's avatar
Remi PLANEL committed
32
33
34
35
36
        .data([_data]);

      // ENTER
      const genomeAxisSelectionEnter = genomeAxisSelection
        .enter()
37
        .append<SVGElement>("g")
Remi  PLANEL's avatar
Remi PLANEL committed
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
        .classed("genome-axis", true);

      genomeAxisSelectionEnter
        .append("g")
        .classed("title", true)
        .append("text");

      genomeAxisSelectionEnter
        .append("g")
        .classed("axis-elems", true);


      // REMOVE 
      genomeAxisSelection.exit().remove();

      //UPDATE
      const genomeAxisSelectionUpdate = genomeAxisSelection
        .merge(genomeAxisSelectionEnter);

      genomeAxisSelectionUpdate
        .select<SVGTextElement>(".title > text")
        .style("fill", "black")
        .style("font-family", "monospace")
61
62
        .attr("transform", d => "translate(" + (width / 2 + d.title.length * 8 / 2) + ",20)")
        .text(d => d.title);
Remi  PLANEL's avatar
Remi PLANEL committed
63
64


65
66
67
68
      genomeAxisSelectionUpdate
        .select<SVGSVGElement>("g.axis-elems")
        .attr("transform", "translate(0, 50)")
        .call(genomeAxisComponent);
Remi  PLANEL's avatar
Remi PLANEL committed
69
70
71
72
73
74
75
76
77
    });

  }
  genomeAxis.scale = function () {
    return xScale;
  }
  return genomeAxis;
}