Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Remi PLANEL
bioviz-js
Commits
988adc3c
Commit
988adc3c
authored
Apr 09, 2019
by
Remi PLANEL
Browse files
Add an axis that shows the chromosome selected
parent
22e07a2d
Changes
1
Hide whitespace changes
Inline
Side-by-side
src/scripts/component/genome-browser.ts
View file @
988adc3c
import
{
select
,
Selection
}
from
"
d3-selection
"
import
GeneComponent
,
{
GeneData
}
from
"
./sequence/gene
"
;
import
GeneComponent
from
"
./sequence/gene
"
;
import
GenomeAxis
from
"
./sequence/genome-axis
"
;
import
GlobalGenomeAxis
from
"
./sequence/genome-axis-with-selection
"
;
import
{
drag
}
from
"
d3-drag
"
;
//types
import
{
GenomeBrowserData
}
from
"
../types
"
;
export
interface
GenomeBrowserData
{
width
:
number
,
genomeWindow
:
{
center
:
number
,
size
:
number
},
eventHandler
?:
{
dragstarted
:
(
elem
:
SVGElement
)
=>
void
,
dragged
:
()
=>
void
,
dragended
:
(
elem
:
SVGElement
)
=>
void
},
currentMousePosition
:
number
,
genes
:
GeneData
[],
x
:
number
,
y
:
number
}
export
default
function
()
{
const
genomeAxis
=
GenomeAxis
();
const
geneComponent
=
GeneComponent
();
const
globalGenomeAxisComponent
=
GlobalGenomeAxis
();
function
genomeBrowser
(
_selection
:
Selection
<
SVGElement
,
Array
<
GenomeBrowserData
>
,
HTMLElement
,
any
>
,
...
...
@@ -49,6 +36,7 @@ export default function () {
.
classed
(
"
genome-browser-background
"
,
true
);
genomeBrowserE
.
append
(
"
g
"
).
classed
(
"
chromosome-axis
"
,
true
);
genomeBrowserE
.
append
(
"
g
"
).
classed
(
"
axis
"
,
true
);
genomeBrowserE
.
append
(
"
g
"
).
classed
(
"
genes
"
,
true
);
...
...
@@ -79,14 +67,21 @@ export default function () {
}
})
);
genomesBrowserU
.
select
<
SVGElement
>
(
"
g.chromosome-axis
"
)
.
datum
(({
axis
:
{
global
}
})
=>
global
)
.
call
(
globalGenomeAxisComponent
,
width
,
0
);
genomesBrowserU
.
select
<
SVGElement
>
(
"
g.axis
"
)
.
datum
(({
genomeWindow
:
{
center
,
size
}
}):
[
number
,
number
]
=>
getGenomeWindow
(
center
,
siz
e
)
)
.
call
(
genomeAxis
,
width
,
0
);
.
datum
(({
axis
:
{
chromosome
}
})
=>
chromosom
e
)
.
call
(
genomeAxis
,
width
,
7
0
);
genomesBrowserU
.
select
<
SVGElement
>
(
"
.genes
"
)
.
datum
(({
genes
})
=>
genes
)
.
attr
(
"
transform
"
,
"
translate(0, 80)
"
)
.
datum
(({
chromosome
:
{
genes
}
})
=>
genes
)
.
call
(
geneComponent
,
genomeAxis
.
scale
(),
40
)
...
...
@@ -95,9 +90,3 @@ export default function () {
return
genomeBrowser
;
}
function
getGenomeWindow
(
center
:
number
,
genomeWindowSize
:
number
):
[
number
,
number
]
{
const
halfWindow
=
genomeWindowSize
/
2
;
return
[
center
-
halfWindow
,
center
+
halfWindow
]
}
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment