genome-browser.ts 2.48 KB
Newer Older
1
import SelectedChromosome from "./selected-chromosome";
Remi  PLANEL's avatar
Remi PLANEL committed
2
import BrushableChromosomeRule from "./ruler/brushable-chromosome";
3
4
// D3
import { select, Selection } from "d3-selection";
5

6
//types
Remi  PLANEL's avatar
Remi PLANEL committed
7
import { GenomeBrowserData, BrushableAxisData, SelectedChromosomeData } from "../types";
8
9
10
11



export default function () {
12
  const classes = {
13
    perDataRootContainer: "genome-browser",
Remi  PLANEL's avatar
Remi PLANEL committed
14
    chromosomeRuler: "chromosome-ruler",
15
16
    selectedChromosome: "selected-chromosomes"
  };
17
  const wholeChromosomeRule = BrushableChromosomeRule();
18
19
  const selectedChromosomeComponent = SelectedChromosome();

20
  let width = 900;
21
  let genomesBrowserU: Selection<SVGGElement, GenomeBrowserData, SVGElement, any> | null = null;
22

23

24
  function genomeBrowser(
25
    _selection: Selection<SVGGElement, Array<GenomeBrowserData>, HTMLElement, any>
26
27
28
29
  ) {
    _selection.each(function (_data: Array<GenomeBrowserData>) {
      const container = select(this);
      const genomeBrowser = container
30
        .selectAll<SVGGElement, GenomeBrowserData>("." + classes.perDataRootContainer)
31
32
33
        .data(_data);

      //ENTER
Remi  PLANEL's avatar
Remi PLANEL committed
34
      const genomeBrowserE = genomeBrowser
35
        .enter()
36
        .append<SVGGElement>("g")
37
        .classed(classes.perDataRootContainer, true);
38

Remi  PLANEL's avatar
Remi PLANEL committed
39
      genomeBrowserE.append("g").classed(classes.chromosomeRuler, true);
40
      genomeBrowserE.append("g")
Remi  PLANEL's avatar
Remi PLANEL committed
41
42
43
        .classed(classes.selectedChromosome, true)
        .attr("transform", "translate(0,70)");

44
45
46
47
      //EXIT
      genomeBrowser.exit().remove();

      //UPDATE
48
      genomesBrowserU = genomeBrowser.merge(genomeBrowserE);
Remi  PLANEL's avatar
Remi PLANEL committed
49

50
      genomesBrowserU.each(function (data) {
51
        const { chromosome: { ruler: chromosomeRule }, selectedChromosome } = data;
Remi  PLANEL's avatar
Remi PLANEL committed
52
        updateWholeChromosomeAxis(chromosomeRule);
53
        updateSelectedChromosome(selectedChromosome);
54
55
56
      });
    });
  }
57

58
  function updateSelectedChromosome(data: SelectedChromosomeData) {
59
    if (genomesBrowserU !== null) {
60
      genomesBrowserU
Remi  PLANEL's avatar
Remi PLANEL committed
61
        .select<SVGGElement>("." + classes.selectedChromosome)
62
        .datum<SelectedChromosomeData[]>([data])
63
        .call(selectedChromosomeComponent, width);
64
    }
65
  }
66

67
68
69
  function updateWholeChromosomeAxis(axis: BrushableAxisData) {
    if (genomesBrowserU) {
      genomesBrowserU
Remi  PLANEL's avatar
Remi PLANEL committed
70
        .select<SVGGElement>("." + classes.chromosomeRuler)
Remi  PLANEL's avatar
Remi PLANEL committed
71
        .datum(axis)
72
        .call(wholeChromosomeRule, width, 0);
73
    }
74
  }
75
  genomeBrowser.updateSelectedChromosome = updateSelectedChromosome;
76
  genomeBrowser.updateWholeChromosomeAxis = updateWholeChromosomeAxis;
77
78
79
  return genomeBrowser;
}

80
81