@jbrowse/plugin-linear-comparative-view 4.0.3 → 4.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm/LGVSyntenyDisplay/model.d.ts +20 -1
- package/esm/LinearComparativeDisplay/stateModelFactory.d.ts +3 -0
- package/esm/LinearComparativeView/components/LinearComparativeRenderArea.js +3 -0
- package/esm/LinearComparativeView/components/OpacitySlider.js +7 -3
- package/esm/LinearComparativeView/components/useRangeSelect.js +3 -0
- package/esm/LinearComparativeView/model.d.ts +90 -57
- package/esm/LinearSyntenyDisplay/afterAttach.js +9 -0
- package/esm/LinearSyntenyDisplay/components/LinearSyntenyRendering.js +15 -15
- package/esm/LinearSyntenyDisplay/components/util.d.ts +1 -0
- package/esm/LinearSyntenyDisplay/components/util.js +23 -38
- package/esm/LinearSyntenyDisplay/drawCigarClickMap.d.ts +2 -0
- package/esm/LinearSyntenyDisplay/drawCigarClickMap.js +88 -0
- package/esm/LinearSyntenyDisplay/{drawMouseoverClickMap.js → drawMouseover.js} +9 -11
- package/esm/LinearSyntenyDisplay/drawRef.d.ts +2 -0
- package/esm/LinearSyntenyDisplay/drawRef.js +190 -0
- package/esm/LinearSyntenyDisplay/drawSynteny.d.ts +4 -6
- package/esm/LinearSyntenyDisplay/drawSynteny.js +4 -461
- package/esm/LinearSyntenyDisplay/drawSyntenyUtils.d.ts +58 -0
- package/esm/LinearSyntenyDisplay/drawSyntenyUtils.js +62 -0
- package/esm/LinearSyntenyDisplay/model.d.ts +47 -2
- package/esm/LinearSyntenyDisplay/model.js +50 -2
- package/esm/LinearSyntenyView/model.d.ts +111 -69
- package/esm/LinearSyntenyView/model.js +23 -24
- package/esm/SyntenyFeatureDetail/LinkToSyntenyView.js +4 -4
- package/package.json +8 -7
- /package/esm/LinearSyntenyDisplay/{drawMouseoverClickMap.d.ts → drawMouseover.d.ts} +0 -0
|
@@ -90,13 +90,6 @@ export default function stateModelFactory(pluginManager) {
|
|
|
90
90
|
icon: CropFreeIcon,
|
|
91
91
|
helpText: 'Square view synchronizes the zoom levels of both genome views by calculating the average zoom level and applying it to both panels. This helps ensure features are displayed at comparable scales, making it easier to compare syntenic regions visually.',
|
|
92
92
|
},
|
|
93
|
-
{
|
|
94
|
-
label: 'Show all regions',
|
|
95
|
-
onClick: self.showAllRegions,
|
|
96
|
-
description: 'Show entire genome assemblies',
|
|
97
|
-
icon: VisibilityIcon,
|
|
98
|
-
helpText: 'This command will zoom out all views to display the entire genome assemblies. This is useful when you want to get a high-level overview of syntenic relationships across whole genomes or when you need to reset the view after zooming into specific regions.',
|
|
99
|
-
},
|
|
100
93
|
{
|
|
101
94
|
label: 'Re-order chromosomes',
|
|
102
95
|
onClick: () => {
|
|
@@ -113,39 +106,46 @@ export default function stateModelFactory(pluginManager) {
|
|
|
113
106
|
helpText: "This operation 'diagonalizes' the data which algorithmically reorders and reorients chromosomes to minimize crossing synteny lines, creating a more diagonal pattern. This makes it easier to identify large-scale genomic rearrangements, inversions, and translocations. The process may take a few moments for large genomes.",
|
|
114
107
|
},
|
|
115
108
|
{
|
|
116
|
-
label: 'Show
|
|
117
|
-
type: 'checkbox',
|
|
118
|
-
checked: self.showDynamicControls,
|
|
119
|
-
onClick: () => {
|
|
120
|
-
self.setShowDynamicControls(!self.showDynamicControls);
|
|
121
|
-
},
|
|
122
|
-
helpText: 'Toggle visibility of dynamic controls like opacity and minimum length sliders. These controls allow you to adjust synteny visualization parameters in real-time.',
|
|
123
|
-
},
|
|
124
|
-
{
|
|
125
|
-
label: 'Draw',
|
|
109
|
+
label: 'Show...',
|
|
126
110
|
subMenu: [
|
|
127
111
|
{
|
|
128
|
-
label: '
|
|
112
|
+
label: 'Show all regions',
|
|
113
|
+
onClick: self.showAllRegions,
|
|
114
|
+
description: 'Show entire genome assemblies',
|
|
115
|
+
icon: VisibilityIcon,
|
|
116
|
+
helpText: 'This command will zoom out all views to display the entire genome assemblies. This is useful when you want to get a high-level overview of syntenic relationships across whole genomes or when you need to reset the view after zooming into specific regions.',
|
|
117
|
+
},
|
|
118
|
+
{
|
|
119
|
+
label: 'Show dynamic controls',
|
|
120
|
+
type: 'checkbox',
|
|
121
|
+
checked: self.showDynamicControls,
|
|
122
|
+
onClick: () => {
|
|
123
|
+
self.setShowDynamicControls(!self.showDynamicControls);
|
|
124
|
+
},
|
|
125
|
+
helpText: 'Toggle visibility of dynamic controls like opacity and minimum length sliders. These controls allow you to adjust synteny visualization parameters in real-time.',
|
|
126
|
+
},
|
|
127
|
+
{
|
|
128
|
+
label: 'Show CIGAR insertions/deletions',
|
|
129
129
|
checked: self.drawCIGAR,
|
|
130
130
|
type: 'checkbox',
|
|
131
|
-
description: 'If disabled, only
|
|
131
|
+
description: 'If disabled, only shows the broad scale CIGAR match',
|
|
132
132
|
onClick: () => {
|
|
133
133
|
self.setDrawCIGAR(!self.drawCIGAR);
|
|
134
134
|
},
|
|
135
135
|
helpText: 'CIGAR strings encode detailed alignment information including matches, insertions, and deletions. When enabled, this option visualizes the fine-scale variations in syntenic alignments. Disable this for a cleaner view that shows only broad syntenic blocks.',
|
|
136
136
|
},
|
|
137
137
|
{
|
|
138
|
-
label: '
|
|
138
|
+
label: 'Show CIGAR matches only',
|
|
139
139
|
checked: self.drawCIGARMatchesOnly,
|
|
140
140
|
type: 'checkbox',
|
|
141
|
-
description: 'If enabled,
|
|
141
|
+
description: 'If enabled, hides the insertions and deletions in the CIGAR strings',
|
|
142
142
|
onClick: () => {
|
|
143
143
|
self.setDrawCIGARMatchesOnly(!self.drawCIGARMatchesOnly);
|
|
144
144
|
},
|
|
145
145
|
helpText: 'When comparing divergent genomes, showing all insertions and deletions can clutter the view. This option filters the CIGAR visualization to show only the matching regions, providing a cleaner view of conserved syntenic blocks while hiding small-scale indels.',
|
|
146
146
|
},
|
|
147
147
|
{
|
|
148
|
-
label: '
|
|
148
|
+
label: 'Show curved lines',
|
|
149
149
|
type: 'checkbox',
|
|
150
150
|
checked: self.drawCurves,
|
|
151
151
|
icon: Curves,
|
|
@@ -155,7 +155,7 @@ export default function stateModelFactory(pluginManager) {
|
|
|
155
155
|
helpText: 'Toggle between straight lines and smooth bezier curves for synteny connections. Curved lines can make the visualization more aesthetically pleasing and may help reduce visual clutter when many syntenic regions are displayed. Straight lines provide a more direct representation.',
|
|
156
156
|
},
|
|
157
157
|
{
|
|
158
|
-
label: '
|
|
158
|
+
label: 'Show location markers',
|
|
159
159
|
type: 'checkbox',
|
|
160
160
|
checked: self.drawLocationMarkers,
|
|
161
161
|
description: 'Draw periodic markers to show location within large matches',
|
|
@@ -188,7 +188,6 @@ export default function stateModelFactory(pluginManager) {
|
|
|
188
188
|
},
|
|
189
189
|
]);
|
|
190
190
|
},
|
|
191
|
-
helpText: 'Export the current synteny view as a scalable vector graphics (SVG) file. SVG format preserves quality at any zoom level and can be edited in vector graphics software like Inkscape or Adobe Illustrator. Perfect for creating publication-quality figures.',
|
|
192
191
|
},
|
|
193
192
|
];
|
|
194
193
|
},
|
|
@@ -10,8 +10,8 @@ const LinkToSyntenyView = observer(function LinkToSyntenyView({ model, feat, })
|
|
|
10
10
|
event.preventDefault();
|
|
11
11
|
const { views } = view;
|
|
12
12
|
if (level !== undefined) {
|
|
13
|
-
views[level]?.navTo(feat);
|
|
14
|
-
views[level + 1]?.navTo(feat.mate);
|
|
13
|
+
views[level]?.navTo(feat, 0.2);
|
|
14
|
+
views[level + 1]?.navTo(feat.mate, 0.2);
|
|
15
15
|
}
|
|
16
16
|
else {
|
|
17
17
|
const f1 = feat;
|
|
@@ -30,8 +30,8 @@ const LinkToSyntenyView = observer(function LinkToSyntenyView({ model, feat, })
|
|
|
30
30
|
: '',
|
|
31
31
|
].join(' ... '));
|
|
32
32
|
}
|
|
33
|
-
v1?.navTo(f1);
|
|
34
|
-
v2?.navTo(f2);
|
|
33
|
+
v1?.navTo(f1, 0.2);
|
|
34
|
+
v2?.navTo(f2, 0.2);
|
|
35
35
|
}
|
|
36
36
|
}, children: "Center view on this feature" }) })) : null, _jsx("li", { children: _jsx(Link, { href: "#", onClick: event => {
|
|
37
37
|
event.preventDefault();
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@jbrowse/plugin-linear-comparative-view",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.1.1",
|
|
4
|
+
"type": "module",
|
|
4
5
|
"description": "JBrowse 2 linear comparative view",
|
|
5
6
|
"keywords": [
|
|
6
7
|
"jbrowse",
|
|
@@ -21,16 +22,16 @@
|
|
|
21
22
|
],
|
|
22
23
|
"dependencies": {
|
|
23
24
|
"@jbrowse/mobx-state-tree": "^5.5.0",
|
|
24
|
-
"@mui/icons-material": "^7.3.
|
|
25
|
-
"@mui/material": "^7.3.
|
|
26
|
-
"copy-to-clipboard": "^3.3.3",
|
|
25
|
+
"@mui/icons-material": "^7.3.7",
|
|
26
|
+
"@mui/material": "^7.3.7",
|
|
27
27
|
"@types/file-saver-es": "^2.0.3",
|
|
28
|
+
"copy-to-clipboard": "^3.3.3",
|
|
28
29
|
"file-saver-es": "^2.0.5",
|
|
29
30
|
"mobx": "^6.15.0",
|
|
30
31
|
"mobx-react": "^9.2.1",
|
|
31
|
-
"@jbrowse/
|
|
32
|
-
"@jbrowse/plugin-alignments": "^4.
|
|
33
|
-
"@jbrowse/
|
|
32
|
+
"@jbrowse/core": "^4.1.1",
|
|
33
|
+
"@jbrowse/plugin-alignments": "^4.1.1",
|
|
34
|
+
"@jbrowse/plugin-linear-genome-view": "^4.1.1"
|
|
34
35
|
},
|
|
35
36
|
"peerDependencies": {
|
|
36
37
|
"react": ">=18.0.0",
|
|
File without changes
|