Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
V
Viz Core
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Build
Pipelines
Jobs
Pipeline schedules
Artifacts
Deploy
Releases
Package Registry
Container Registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
Community forum
Contribute to GitLab
Provide feedback
Terms and privacy
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
MetaboHUB
web-components
Viz Core
Commits
edbc70ab
Commit
edbc70ab
authored
2 months ago
by
Jean-Clement Gallardo
Browse files
Options
Downloads
Plain Diff
Merge branch 'hotfix/0.11.31'
parents
7cf8d9bc
b25f31bc
No related branches found
Branches containing commit
Tags
0.11.31
Tags containing commit
No related merge requests found
Pipeline
#280618
passed
2 months ago
Changes
2
Pipelines
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
src/components/NetworkComponent.vue
+7
-6
7 additions, 6 deletions
src/components/NetworkComponent.vue
src/composables/UseGraphManager.ts
+21
-7
21 additions, 7 deletions
src/composables/UseGraphManager.ts
with
28 additions
and
13 deletions
src/components/NetworkComponent.vue
+
7
−
6
View file @
edbc70ab
...
@@ -34,7 +34,7 @@
...
@@ -34,7 +34,7 @@
<
script
setup
lang=
"ts"
>
<
script
setup
lang=
"ts"
>
// Import -----------
// Import -----------
// Utils ----------
// Utils ----------
import
{
defineBrush
}
from
'
../composables/UseGraphManager
'
;
import
{
defineBrush
,
updateNetworkForBrush
}
from
'
../composables/UseGraphManager
'
;
import
{
initZoom
,
stopZoom
}
from
"
../composables/UseZoomSvg
"
;
import
{
initZoom
,
stopZoom
}
from
"
../composables/UseZoomSvg
"
;
import
{
rescale
}
from
"
../composables/UseZoomSvg
"
;
import
{
rescale
}
from
"
../composables/UseZoomSvg
"
;
// Type -----------
// Type -----------
...
@@ -138,22 +138,23 @@ function mouseLeaveNode(Event: MouseEvent, node: Node): void {
...
@@ -138,22 +138,23 @@ function mouseLeaveNode(Event: MouseEvent, node: Node): void {
onMounted
(
async
()
=>
{
onMounted
(
async
()
=>
{
const
checkDOM
=
document
.
querySelector
(
'
.globalviz
'
);
const
checkDOM
=
document
.
querySelector
(
'
.globalviz
'
);
if
(
checkDOM
)
{
if
(
checkDOM
)
{
console
.
log
(
'
checkDOM pass
'
);
if
(
networkSvg
.
value
)
{
if
(
networkSvg
.
value
)
{
zoomStatus
.
instance
=
initZoom
(
networkSvg
.
value
as
SVGElement
,
graphG
.
value
as
SVGGElement
);
zoomStatus
.
instance
=
initZoom
(
networkSvg
.
value
as
SVGElement
,
graphG
.
value
as
SVGGElement
);
emit
(
'
initZoom
'
,
zoomStatus
.
instance
);
emit
(
'
initZoom
'
,
zoomStatus
.
instance
);
defineBrush
(
globalViz
.
value
as
HTMLElement
,
brushG
.
value
as
SVGGElement
,
props
.
network
,
props
.
graphStyleProperties
?.
nodeStyles
as
{
[
key
:
string
]:
NodeStyle
},
zoomStatus
.
instance
);
zoomStatus
.
autoRescale
=
await
nextTick
().
then
(()
=>
{
zoomStatus
.
autoRescale
=
await
nextTick
().
then
(()
=>
{
return
true
});
defineBrush
(
globalViz
.
value
as
HTMLElement
,
brushG
.
value
as
SVGGElement
,
props
.
network
,
props
.
graphStyleProperties
?.
nodeStyles
as
{
[
key
:
string
]:
NodeStyle
},
zoomStatus
.
instance
);
return
true
});
}
}
}
}
});
});
onUpdated
(()
=>
{
onUpdated
(
async
()
=>
{
if
(
networkSvg
.
value
&&
zoomStatus
.
instance
===
undefined
)
{
if
(
networkSvg
.
value
&&
zoomStatus
.
instance
===
undefined
)
{
console
.
log
(
'
onUpdated, initZoom
'
);
zoomStatus
.
instance
=
initZoom
(
networkSvg
.
value
as
SVGElement
,
graphG
.
value
as
SVGGElement
);
zoomStatus
.
instance
=
initZoom
(
networkSvg
.
value
as
SVGElement
,
graphG
.
value
as
SVGGElement
);
emit
(
'
initZoom
'
,
zoomStatus
.
instance
);
emit
(
'
initZoom
'
,
zoomStatus
.
instance
);
}
}
updateNetworkForBrush
(
props
.
network
);
});
});
onBeforeUnmount
(()
=>
{
onBeforeUnmount
(()
=>
{
...
...
This diff is collapsed.
Click to expand it.
src/composables/UseGraphManager.ts
+
21
−
7
View file @
edbc70ab
...
@@ -4,6 +4,11 @@ import type { NodeStyle } from "../types/NodeStyle";
...
@@ -4,6 +4,11 @@ import type { NodeStyle } from "../types/NodeStyle";
import
{
screenSize
,
applyInverseTransform
}
from
"
../utils/GraphUtils
"
;
import
{
screenSize
,
applyInverseTransform
}
from
"
../utils/GraphUtils
"
;
import
{
getNodeStyle
}
from
"
../utils/NodeStyles
"
;
import
{
getNodeStyle
}
from
"
../utils/NodeStyles
"
;
import
*
as
d3
from
'
d3
'
;
import
*
as
d3
from
'
d3
'
;
import
{
reactive
}
from
"
vue
"
;
const
brushProperties
=
reactive
({
nodes
:
{}
as
{[
key
:
string
]:
Node
}
})
/**
/**
* Change a boolean to switch between two modes. For example between selection and zoom for graph panel
* Change a boolean to switch between two modes. For example between selection and zoom for graph panel
...
@@ -36,6 +41,8 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
...
@@ -36,6 +41,8 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
const
svgWidth
=
svgSize
[
0
]
as
number
;
const
svgWidth
=
svgSize
[
0
]
as
number
;
const
svgHeight
=
svgSize
[
1
]
as
number
;
const
svgHeight
=
svgSize
[
1
]
as
number
;
brushProperties
.
nodes
=
network
.
nodes
;
function
endBrush
(
e
:
any
)
{
function
endBrush
(
e
:
any
)
{
if
(
!
e
.
selection
){
if
(
!
e
.
selection
){
return
;
// Prevent infinity loop
return
;
// Prevent infinity loop
...
@@ -52,8 +59,8 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
...
@@ -52,8 +59,8 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
// Handle selection logic here
// Handle selection logic here
if
(
extent
[
1
][
0
]
-
extent
[
0
][
0
]
>
20
||
extent
[
1
][
1
]
-
extent
[
0
][
1
]
>
20
)
{
if
(
extent
[
1
][
0
]
-
extent
[
0
][
0
]
>
20
||
extent
[
1
][
1
]
-
extent
[
0
][
1
]
>
20
)
{
Object
.
keys
(
network
.
nodes
).
forEach
((
nodeID
:
string
)
=>
{
Object
.
keys
(
brushProperties
.
nodes
).
forEach
((
nodeID
:
string
)
=>
{
const
node
=
network
.
nodes
[
nodeID
];
const
node
=
brushProperties
.
nodes
[
nodeID
];
const
nodeStyle
=
getNodeStyle
(
node
,
styles
);
const
nodeStyle
=
getNodeStyle
(
node
,
styles
);
const
xCenter
=
node
.
x
+
(
nodeStyle
.
width
as
number
/
2
);
const
xCenter
=
node
.
x
+
(
nodeStyle
.
width
as
number
/
2
);
...
@@ -61,14 +68,14 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
...
@@ -61,14 +68,14 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
if
((
realX0
<=
xCenter
&&
xCenter
<
realX1
)
if
((
realX0
<=
xCenter
&&
xCenter
<
realX1
)
&&
(
realY0
<=
yCenter
&&
yCenter
<
realY1
)){
&&
(
realY0
<=
yCenter
&&
yCenter
<
realY1
)){
if
(
network
.
nodes
[
nodeID
])
{
if
(
brushProperties
.
nodes
[
nodeID
])
{
if
(
network
.
nodes
[
nodeID
].
selected
)
{
if
(
brushProperties
.
nodes
[
nodeID
].
selected
)
{
network
.
nodes
[
nodeID
].
selected
=
true
;
brushProperties
.
nodes
[
nodeID
].
selected
=
true
;
}
else
{
}
else
{
network
.
nodes
[
nodeID
].
selected
=
true
;
brushProperties
.
nodes
[
nodeID
].
selected
=
true
;
}
}
}
else
{
}
else
{
network
.
nodes
[
nodeID
].
selected
=
true
;
brushProperties
.
nodes
[
nodeID
].
selected
=
true
;
}
}
}
}
});
});
...
@@ -101,6 +108,13 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
...
@@ -101,6 +108,13 @@ export function defineBrush(globalViz: HTMLElement, brushG: SVGGElement, network
});
});
}
}
/**
* Update network for brush functions
*/
export
function
updateNetworkForBrush
(
network
:
Network
):
void
{
brushProperties
.
nodes
=
network
.
nodes
;
}
/**
/**
* Remove brush tag and functions
* Remove brush tag and functions
*/
*/
...
...
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
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!
Save comment
Cancel
Please
register
or
sign in
to comment