genome-browser.ts 2.49 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 = {
Remi  PLANEL's avatar
Remi PLANEL committed
13
    chromosomeRuler: "chromosome-ruler",
14
15
    selectedChromosome: "selected-chromosomes"
  };
16
  const wholeChromosomeRule = BrushableChromosomeRule();
17
18
  const selectedChromosomeComponent = SelectedChromosome();

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

22
  
23
  function genomeBrowser(
24
    _selection: Selection<SVGGElement, Array<GenomeBrowserData>, HTMLElement, any>
25
  ) {
26
    // width = w;
27
28
29
    _selection.each(function (_data: Array<GenomeBrowserData>) {
      const container = select(this);
      const genomeBrowser = container
30
        .selectAll<SVGGElement, GenomeBrowserData>(".genome-browser")
31
32
33
        .data(_data);

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

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

51
      genomesBrowserU.each(function (data) {
Remi  PLANEL's avatar
Remi PLANEL committed
52
        const {
Remi  PLANEL's avatar
Remi PLANEL committed
53
54
          chromosome: { ruler: chromosomeRule },
          selectedChromosome: { genes: selectedGenes, ruler: selectedChromosomeRule },
Remi  PLANEL's avatar
Remi PLANEL committed
55
56
57
          // axis: { chromosome, global }
        } = data;
        updateWholeChromosomeAxis(chromosomeRule);
58
        updateSelectedChromosome(data);
59
60
61
      });
    });
  }
62

63
64
  function updateSelectedChromosome(data: GenomeBrowserData) {
    if (genomesBrowserU !== null) {
65
      genomesBrowserU
Remi  PLANEL's avatar
Remi PLANEL committed
66
        .select<SVGGElement>("." + classes.selectedChromosome)
67
68
        .datum<SelectedChromosomeData[]>([data.selectedChromosome])
        .call(selectedChromosomeComponent, width);
69
    }
70
  }
71

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

84
85