Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
C
clinicaltrials
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
david Chavalarias
clinicaltrials
Commits
e5d1e4ec
Commit
e5d1e4ec
authored
Sep 22, 2017
by
Romain Loth
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
WIP bi colors in bipa cases
parent
ce9b46c4
Changes
12
Show whitespace changes
Inline
Side-by-side
Showing
12 changed files
with
355 additions
and
278 deletions
+355
-278
explorerjs.html
explorerjs.html
+5
-5
settings_explorerjs.js
settings_explorerjs.js
+3
-3
selection-panels-mobile.css
twlibs/css/selection-panels-mobile.css
+9
-6
selection-panels.css
twlibs/css/selection-panels.css
+29
-18
enviroment.js
twmain/enviroment.js
+3
-3
extras_explorerjs.js
twmain/extras_explorerjs.js
+116
-100
globalUtils.js
twmain/globalUtils.js
+4
-2
methods.js
twmain/methods.js
+2
-2
sigma.parseCustom.js
twmain/sigma.parseCustom.js
+2
-2
sigmaUtils.js
twmain/sigmaUtils.js
+179
-134
settings_explorerjs.comex.js
twpresets/settings_explorerjs.comex.js
+2
-2
settings_explorerjs.devdefault.js
twpresets/settings_explorerjs.devdefault.js
+1
-1
No files found.
explorerjs.html
View file @
e5d1e4ec
...
@@ -159,8 +159,8 @@
...
@@ -159,8 +159,8 @@
<li>
<li>
<a>
<a>
<select id="aselector" onchange="console.log('salut monde')" class="selectpicker" data-style="btn btn-success btn-sm" data-width="auto">
<select id="aselector" onchange="console.log('salut monde')" class="selectpicker" data-style="btn btn-success btn-sm" data-width="auto">
<option value="
Document
" selected>Scholars</option>
<option value="
Scholars
" selected>Scholars</option>
<option value="
NGram
">Keywords</option>
<option value="
Keywords
">Keywords</option>
</select>
</select>
</a>
</a>
</li>
</li>
...
@@ -430,9 +430,9 @@
...
@@ -430,9 +430,9 @@
</div>
<!-- /row -->
</div>
<!-- /row -->
</div>
</div>
<!-- attributes' legends (absolute position bottom left)
<!-- class="my-legend" (absolute position bottom left
) -->
(contains one div of class "my-legend" per colored nodetype
) -->
<div
id=
"legend-for-
cluster
s"
class=
"over-panels"
></div>
<div
id=
"legend-for-
facet
s"
class=
"over-panels"
></div>
<!-- to reopen the panel -->
<!-- to reopen the panel -->
<div
id=
"sideunfold"
>
<div
id=
"sideunfold"
>
...
...
settings_explorerjs.js
View file @
e5d1e4ec
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
// ...or remote bridge to default source api ajax queries
// ...or remote bridge to default source api ajax queries
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
NGram"
,
"node1"
:
"Document
"
}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
Keywords"
,
"node1"
:
"Scholars
"
}
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
...
@@ -114,8 +114,8 @@ TW.conf = (function(TW){
...
@@ -114,8 +114,8 @@ TW.conf = (function(TW){
// =============
// =============
// Node typology: categories (resp. 0 and 1) will get these default labels
// Node typology: categories (resp. 0 and 1) will get these default labels
TWConf
.
catSem
=
"
NGram
"
;
TWConf
.
catSem
=
"
Keywords
"
;
TWConf
.
catSoc
=
"
Document
"
;
TWConf
.
catSoc
=
"
Scholars
"
;
// NB: these labels may be superseded by:
// NB: these labels may be superseded by:
// - the input data's node types values cf. sortNodeTypes()
// - the input data's node types values cf. sortNodeTypes()
// - in servermenu mode, by the node0 & node1 properties
// - in servermenu mode, by the node0 & node1 properties
...
...
twlibs/css/selection-panels-mobile.css
View file @
e5d1e4ec
...
@@ -49,8 +49,8 @@
...
@@ -49,8 +49,8 @@
}
}
/* legend re-positioned */
/* legend re-positioned */
.my-legend
{
#legend-for-facets
{
bottom
:
calc
(
40%
-
10
5
px
);
bottom
:
calc
(
40%
-
10
0
px
);
/* bot just above #sidebar which has top at calc(105px + 60%); */
/* bot just above #sidebar which has top at calc(105px + 60%); */
}
}
...
@@ -97,17 +97,20 @@
...
@@ -97,17 +97,20 @@
}
}
/* legend reduction */
/* legend reduction */
#legend-for-facets
{
max-width
:
25%
;
}
.my-legend
{
.my-legend
{
max-width
:
27%
;
max-height
:
25%
;
max-height
:
25%
;
padding
:
0
2px
;
font-size
:
85%
;
font-size
:
85%
;
margin
:
0
0
5px
0
;
margin
:
0
;
padding
:
0
1px
3px
1px
;
}
}
.my-legend
.legend-title
{
.my-legend
.legend-title
{
margin-bottom
:
0
;
margin-bottom
:
0
;
font-size
:
90
%
;
font-size
:
85
%
;
}
}
.my-legend
.legend-scale
ul
{
.my-legend
.legend-scale
ul
{
margin-bottom
:
0
;
margin-bottom
:
0
;
...
...
twlibs/css/selection-panels.css
View file @
e5d1e4ec
...
@@ -33,44 +33,55 @@
...
@@ -33,44 +33,55 @@
}
}
/* LEGEND PANEL */
/* LEGEND PANEL */
.my-legend
{
#legend-for-facets
{
position
:
fixed
;
bottom
:
10px
;
/* width: we set it equal or smaller than #lefttopbox width */
max-width
:
20%
;
max-height
:
30%
;
padding
:
0
5px
;
overflow-y
:
scroll
;
bottom
:
18px
;
left
:
0
;
left
:
0
;
border
:
solid
1px
black
;
position
:
fixed
;
background-color
:
white
;
/* width: we set it a bit more than #lefttopbox width */
opacity
:
0.8
;
max-width
:
20%
;
color
:
#250587
;
max-height
:
40%
;
margin
:
7px
;
font-size
:
120%
;
font-size
:
120%
;
cursor
:
default
;
cursor
:
default
;
overflow-y
:
auto
;
overflow-x
:
hidden
;
}
.my-legend
{
position
:
relative
;
height
:
100%
;
width
:
100%
;
margin
:
0
;
padding
:
0
5px
5px
5px
;
opacity
:
1
;
background-color
:
white
;
color
:
#250587
;
overflow
:
hidden
;
z-index
:
5
;
}
}
.my-legend
.legend-title
{
.my-legend
.legend-title
{
text-align
:
left
;
text-align
:
left
;
margin-bottom
:
5px
;
margin-bottom
:
5px
;
font-weight
:
bold
;
font-weight
:
bold
;
font-size
:
90%
;
font-size
:
75%
;
}
}
.my-legend
.legend-scale
ul
{
.my-legend
.legend-scale
ul
{
margin
:
0
;
margin
:
0
;
margin-bottom
:
5px
;
margin-bottom
:
5px
;
padding
:
0
;
padding
:
0
;
float
:
left
;
float
:
left
;
list-style
:
none
;
list-style
:
none
;
}
}
.my-legend
.legend-scale
ul
li
{
.my-legend
.legend-scale
ul
li
{
font-size
:
80%
;
font-size
:
80%
;
list-style
:
none
;
list-style
:
none
;
margin-left
:
0
;
margin-left
:
0
;
line-height
:
16px
;
line-height
:
16px
;
margin-bottom
:
2px
;
margin-bottom
:
2px
;
}
}
.my-legend
ul
.legend-labels
li
span
.lgdcol
{
.my-legend
ul
.legend-labels
li
span
.lgdcol
{
display
:
block
;
display
:
block
;
float
:
left
;
float
:
left
;
...
...
twmain/enviroment.js
View file @
e5d1e4ec
...
@@ -23,8 +23,8 @@ TW.gui.checkBox=false;
...
@@ -23,8 +23,8 @@ TW.gui.checkBox=false;
TW
.
gui
.
shiftKey
=
false
;
TW
.
gui
.
shiftKey
=
false
;
TW
.
gui
.
foldedSide
=
false
;
TW
.
gui
.
foldedSide
=
false
;
TW
.
gui
.
manuallyChecked
=
false
;
TW
.
gui
.
manuallyChecked
=
false
;
TW
.
gui
.
handpickedcolor
=
false
;
// <= changes edge rendering strategy
TW
.
gui
.
handpickedcolor
=
{};
// <= changes rendering, by nodetype
TW
.
gui
.
lastFilters
=
{}
TW
.
gui
.
lastFilters
=
{}
// <= last values, by slider id
TW
.
gui
.
reldocTabs
=
[{},
{}]
// <= by nodetype and then dbtype
TW
.
gui
.
reldocTabs
=
[{},
{}]
// <= by nodetype and then dbtype
TW
.
gui
.
sizeRatios
=
[
1
,
1
]
// sizeRatios per nodetype
TW
.
gui
.
sizeRatios
=
[
1
,
1
]
// sizeRatios per nodetype
...
@@ -519,7 +519,7 @@ function changeType(optionaltypeFlag) {
...
@@ -519,7 +519,7 @@ function changeType(optionaltypeFlag) {
// update the gui (POSS could be handled by TW.pushGUIState)
// update the gui (POSS could be handled by TW.pushGUIState)
TW
.
gui
.
handpickedcolor
=
fals
e
TW
.
gui
.
handpickedcolor
=
{}
// <=> non
e
updateDynamicFacets
()
updateDynamicFacets
()
changeGraphAppearanceByFacets
(
getActivetypesNames
()
)
changeGraphAppearanceByFacets
(
getActivetypesNames
()
)
...
...
twmain/extras_explorerjs.js
View file @
e5d1e4ec
...
@@ -71,7 +71,7 @@ function changeGraphAppearanceByFacets(actypes) {
...
@@ -71,7 +71,7 @@ function changeGraphAppearanceByFacets(actypes) {
let
currentNbNodes
=
TW
.
partialGraph
.
graph
.
nNodes
()
let
currentNbNodes
=
TW
.
partialGraph
.
graph
.
nNodes
()
// create colormenu and 1st default entry
// create colormenu and 1st default entry
var
color_menu_info
=
'<li><a href="#" onclick="TW.gui.handpickedcolor =
false
; graphResetLabelsAndSizes() ; TW.partialGraph.refresh()">By Default</a></li>'
;
var
color_menu_info
=
'<li><a href="#" onclick="TW.gui.handpickedcolor =
{}
; graphResetLabelsAndSizes() ; TW.partialGraph.refresh()">By Default</a></li>'
;
let
gotPreviousLouvain
=
false
let
gotPreviousLouvain
=
false
if
(
$
(
"#colorgraph-menu"
).
length
>
0
)
{
if
(
$
(
"#colorgraph-menu"
).
length
>
0
)
{
...
@@ -130,7 +130,7 @@ function changeGraphAppearanceByFacets(actypes) {
...
@@ -130,7 +130,7 @@ function changeGraphAppearanceByFacets(actypes) {
}
}
else
attLabel
=
attTitle
else
attLabel
=
attTitle
color_menu_info
+=
`<li><a href="#" onclick='
${
colMethod
}
("
${
attTitle
}
")'>By
${
attLabel
}
(
${
attNbClasses
}
|
${
attNbNodes
}
)</a></li>`
color_menu_info
+=
`<li><a href="#" onclick='
${
colMethod
}
("
${
attTitle
}
"
,"
${
ty
}
"
)'>By
${
attLabel
}
(
${
attNbClasses
}
|
${
attNbNodes
}
)</a></li>`
}
}
// POSS add cumulated degree via TW.partialGraph.graph.degree(nid)
// POSS add cumulated degree via TW.partialGraph.graph.degree(nid)
...
@@ -151,8 +151,8 @@ function changeGraphAppearanceByFacets(actypes) {
...
@@ -151,8 +151,8 @@ function changeGraphAppearanceByFacets(actypes) {
}
}
// @cb: optional callback
function
RunLouvain
()
{
function
RunLouvain
(
cb
)
{
var
node_realdata
=
[]
var
node_realdata
=
[]
var
nodesV
=
getVisibleNodes
()
var
nodesV
=
getVisibleNodes
()
...
@@ -216,6 +216,11 @@ function RunLouvain() {
...
@@ -216,6 +216,11 @@ function RunLouvain() {
TW
.
facetOptions
[
'clust_louvain'
]
=
{
'col'
:
'cluster'
}
TW
.
facetOptions
[
'clust_louvain'
]
=
{
'col'
:
'cluster'
}
}
}
// NB the LouvainFait flag is updated by caller fun
// NB the LouvainFait flag is updated by caller fun
// callback
if
(
cb
&&
typeof
cb
==
'function'
)
{
cb
()
}
}
}
...
@@ -269,25 +274,29 @@ function graphResetLabelsAndSizes(){
...
@@ -269,25 +274,29 @@ function graphResetLabelsAndSizes(){
n
.
size
=
TW
.
Nodes
[
n
.
id
].
size
n
.
size
=
TW
.
Nodes
[
n
.
id
].
size
}
}
}
}
set_ClustersLegend
()
}
}
// @daclass: the name of a numeric/categorical attribute from node.attributes
// @daclass: the name of a numeric/categorical attribute from node.attributes
// @forTypes: optional array of which typenames are concerned
// @groupingTicks: an optional threshold's array expressing ranges with their low/up bounds label and ref to matchin nodeIds
// @groupingTicks: an optional threshold's array expressing ranges with their low/up bounds label and ref to matchin nodeIds
function
set_ClustersLegend
(
daclass
,
groupedByTicks
)
{
function
set_ClustersLegend
(
daclass
,
forTypes
,
groupedByTicks
)
{
$
(
"#legend-for-clusters"
).
removeClass
(
"my-legend"
)
$
(
"#legend-for-clusters"
).
html
(
""
)
if
(
daclass
==
null
)
return
;
var
actypes
=
getActivetypesNames
()
// shortcut to erase legends for all types
if
(
daclass
==
null
)
{
$
(
"#legend-for-facets"
).
html
(
""
)
};
// TODO test more for multiple types
// current display among TW.categories (ex: ['terms'])
// we have no specifications yet for colors (and legends) on multiple types
if
(
typeof
forTypes
!=
'array'
||
!
forTypes
.
length
)
{
if
(
actypes
.
length
>
1
)
{
forTypes
=
getActivetypesNames
().
filter
(
function
(
ty
){
console
.
warn
(
"colors by bins will only color nodes of type 0"
)
return
daclass
in
TW
.
Facets
[
ty
]
})
}
}
// current display among TW.categories (ex: 'terms')
var
curType
=
actypes
[
0
]
for
(
var
k
in
forTypes
)
{
let
curType
=
forTypes
[
k
]
var
LegendDiv
=
"<div id=legend-for-"
+
curType
+
" class=
\"
over-panels my-legend
\"
>"
// all infos in a bin array
// all infos in a bin array
var
legendInfo
=
[]
var
legendInfo
=
[]
...
@@ -297,9 +306,7 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
...
@@ -297,9 +306,7 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
// passed as arg or prepared in parseCustom
// passed as arg or prepared in parseCustom
if
(
!
groupedByTicks
&&
(
!
TW
.
Facets
[
curType
]
||
!
TW
.
Facets
[
curType
][
daclass
]))
{
if
(
!
groupedByTicks
&&
(
!
TW
.
Facets
[
curType
]
||
!
TW
.
Facets
[
curType
][
daclass
]))
{
console
.
warn
(
`no class bins for
${
daclass
}
, displaying no legend`
)
console
.
warn
(
`no class bins for
${
curType
}
${
daclass
}
`
)
$
(
"#legend-for-clusters"
).
hide
()
}
}
else
{
else
{
let
daclassLabel
=
daclass
let
daclassLabel
=
daclass
...
@@ -308,8 +315,8 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
...
@@ -308,8 +315,8 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
&&
TW
.
facetOptions
[
daclass
].
legend
)
{
&&
TW
.
facetOptions
[
daclass
].
legend
)
{
daclassLabel
=
TW
.
facetOptions
[
daclass
].
legend
daclassLabel
=
TW
.
facetOptions
[
daclass
].
legend
}
}
var
LegendDiv
=
""
LegendDiv
+=
` <div class="legend-title">
${
daclassLabel
}
</div>`
LegendDiv
+=
` <div class="legend-title">
${
curType
}
:
${
daclassLabel
}
</div>`
LegendDiv
+=
' <div class="legend-scale">'
LegendDiv
+=
' <div class="legend-scale">'
LegendDiv
+=
' <ul class="legend-labels">'
LegendDiv
+=
' <ul class="legend-labels">'
...
@@ -397,11 +404,20 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
...
@@ -397,11 +404,20 @@ function set_ClustersLegend ( daclass, groupedByTicks ) {
}
}
LegendDiv
+=
' </ul>'
LegendDiv
+=
' </ul>'
LegendDiv
+=
' </div>'
LegendDiv
+=
' </div>'
LegendDiv
+=
' </div>'
$
(
"#legend-for-clusters"
).
addClass
(
"my-legend"
);
let
perhapsPreviousLegend
=
document
.
getElementById
(
"legend-for-"
+
curType
)
$
(
"#legend-for-clusters"
).
html
(
LegendDiv
)
if
(
perhapsPreviousLegend
)
{
$
(
"#legend-for-clusters"
).
show
()
perhapsPreviousLegend
.
outerHTML
=
LegendDiv
}
else
{
let
newLegend
=
document
.
createElement
(
'div'
)
document
.
getElementById
(
"legend-for-facets"
).
appendChild
(
newLegend
)
newLegend
.
outerHTML
=
LegendDiv
}
}
}
}
$
(
"#legend-for-facets"
).
show
()
}
}
// = = = = = = = = = = = [ / Clusters Plugin ] = = = = = = = = = = = //
// = = = = = = = = = = = [ / Clusters Plugin ] = = = = = = = = = = = //
...
...
twmain/globalUtils.js
View file @
e5d1e4ec
...
@@ -96,9 +96,11 @@ function isUndef(variable){
...
@@ -96,9 +96,11 @@ function isUndef(variable){
function
stringToSomeInt
(
anyString
)
{
function
stringToSomeInt
(
anyString
)
{
let
charCodeSum
=
0
let
charCodeSum
=
0
if
(
anyString
&&
anyString
.
length
)
{
for
(
let
i
=
0
;
i
<
anyString
.
length
;
i
++
)
{
for
(
let
i
=
0
;
i
<
anyString
.
length
;
i
++
)
{
charCodeSum
+=
anyString
.
charCodeAt
(
i
)
charCodeSum
+=
anyString
.
charCodeAt
(
i
)
}
}
}
return
charCodeSum
return
charCodeSum
}
}
...
...
twmain/methods.js
View file @
e5d1e4ec
...
@@ -97,7 +97,7 @@ TW.resetGraph = function() {
...
@@ -97,7 +97,7 @@ TW.resetGraph = function() {
// reset rendering gui flags
// reset rendering gui flags
TW
.
gui
.
selectionActive
=
false
TW
.
gui
.
selectionActive
=
false
TW
.
gui
.
handpickedcolor
=
false
TW
.
gui
.
handpickedcolor
=
{}
// reset circle size and cursor
// reset circle size and cursor
TW
.
gui
.
circleSize
=
0
TW
.
gui
.
circleSize
=
0
...
@@ -734,7 +734,7 @@ function prepareNodesRenderingProperties(nodesDict) {
...
@@ -734,7 +734,7 @@ function prepareNodesRenderingProperties(nodesDict) {
// default unselected color
// default unselected color
defgrey_color
:
"rgba("
+
rgbStr
+
","
+
TW
.
conf
.
sigmaJsDrawingProperties
.
twNodesGreyOpacity
+
")"
,
defgrey_color
:
"rgba("
+
rgbStr
+
","
+
TW
.
conf
.
sigmaJsDrawingProperties
.
twNodesGreyOpacity
+
")"
,
// will be used for repainting (read when TW.gui.handpickedcolor flag)
// will be used for repainting (read when TW.gui.handpickedcolor flag
s
)
alt_color
:
null
,
alt_color
:
null
,
altgrey_color
:
null
,
altgrey_color
:
null
,
}
}
...
...
twmain/sigma.parseCustom.js
View file @
e5d1e4ec
...
@@ -211,8 +211,8 @@ function scanGexf(gexfContent) {
...
@@ -211,8 +211,8 @@ function scanGexf(gexfContent) {
// ex: terms
// ex: terms
// ex: ISItermsriskV2_140 & ISItermsriskV2_140
// ex: ISItermsriskV2_140 & ISItermsriskV2_140
// optional arg optionalNodeConf should contain keys of the form:
// optional arg optionalNodeConf should contain keys of the form:
// "node0": "
NGram
",
// "node0": "
Keywords
",
// "node1": "
Document
"
// "node1": "
Scholars
"
// etc.
// etc.
// (it's read from project_conf.json)
// (it's read from project_conf.json)
function
sortNodeTypes
(
observedTypesDict
,
optionalNodeConf
)
{
function
sortNodeTypes
(
observedTypesDict
,
optionalNodeConf
)
{
...
...
twmain/sigmaUtils.js
View file @
e5d1e4ec
...
@@ -118,7 +118,7 @@ var SigmaUtils = function () {
...
@@ -118,7 +118,7 @@ var SigmaUtils = function () {
context
.
beginPath
();
context
.
beginPath
();
if
(
settings
(
'twSelectedColor'
)
==
"node"
)
if
(
settings
(
'twSelectedColor'
)
==
"node"
)
context
.
fillStyle
=
TW
.
gui
.
handpickedcolor
?
node
.
customAttrs
.
alt_color
:
node
.
color
;
// node's
context
.
fillStyle
=
TW
.
gui
.
handpickedcolor
[
node
.
type
]
?
node
.
customAttrs
.
alt_color
:
node
.
color
;
// node's
else
else
context
.
fillStyle
=
"#fff"
;
// default
context
.
fillStyle
=
"#fff"
;
// default
...
@@ -180,7 +180,6 @@ var SigmaUtils = function () {
...
@@ -180,7 +180,6 @@ var SigmaUtils = function () {
var
color
,
size
,
var
color
,
size
,
prefix
=
settings
(
'prefix'
)
||
''
prefix
=
settings
(
'prefix'
)
||
''
//debug
//debug
// console.warn("rendering edge", edge)
// console.warn("rendering edge", edge)
...
@@ -188,7 +187,7 @@ var SigmaUtils = function () {
...
@@ -188,7 +187,7 @@ var SigmaUtils = function () {
// precomputed color with no opacity
// precomputed color with no opacity
// cf. sigmaTools.edgeRGB
// cf. sigmaTools.edgeRGB
var
baseRGB
=
TW
.
gui
.
handpickedc
olor
?
edge
.
customAttrs
.
alt_rgb
:
edge
.
customAttrs
.
rgb
var
baseRGB
=
edge
.
customAttrs
.
useAltC
olor
?
edge
.
customAttrs
.
alt_rgb
:
edge
.
customAttrs
.
rgb
if
(
edge
.
customAttrs
.
activeEdge
)
{
if
(
edge
.
customAttrs
.
activeEdge
)
{
size
=
(
defSize
*
2
)
+
1
size
=
(
defSize
*
2
)
+
1
...
@@ -291,7 +290,7 @@ var SigmaUtils = function () {
...
@@ -291,7 +290,7 @@ var SigmaUtils = function () {
// mode variants 1: if a coloringFunction is active
// mode variants 1: if a coloringFunction is active
if
(
!
TW
.
gui
.
handpickedcolor
)
{
if
(
!
TW
.
gui
.
handpickedcolor
[
node
.
type
]
)
{
nodeColor
=
node
.
color
nodeColor
=
node
.
color
}
}
else
{
else
{
...
@@ -301,7 +300,6 @@ var SigmaUtils = function () {
...
@@ -301,7 +300,6 @@ var SigmaUtils = function () {
// mode variants 2: if node is selected, highlighted or unselected
// mode variants 2: if node is selected, highlighted or unselected
if
(
TW
.
gui
.
selectionActive
)
{
if
(
TW
.
gui
.
selectionActive
)
{
// the selected node(s)
// the selected node(s)
if
(
node
.
customAttrs
.
active
)
{
if
(
node
.
customAttrs
.
active
)
{
// called by label+background overlay cf. "subcall"
// called by label+background overlay cf. "subcall"
...
@@ -317,7 +315,7 @@ var SigmaUtils = function () {
...
@@ -317,7 +315,7 @@ var SigmaUtils = function () {
// passive nodes should blend in the grey of twEdgeGreyColor
// passive nodes should blend in the grey of twEdgeGreyColor
// cf settings_explorerjs, defgrey_color and deselectNodes()
// cf settings_explorerjs, defgrey_color and deselectNodes()
else
{
else
{
if
(
!
TW
.
gui
.
handpickedcolor
)
{
if
(
!
TW
.
gui
.
handpickedcolor
[
node
.
type
]
)
{
nodeColor
=
node
.
customAttrs
.
defgrey_color
nodeColor
=
node
.
customAttrs
.
defgrey_color
}
}
else
{
else
{
...
@@ -656,11 +654,15 @@ function edgeInfos(anEdge) {
...
@@ -656,11 +654,15 @@ function edgeInfos(anEdge) {
}
}
// FIXME this function could be optimized
function
gradientColoring
(
daclass
)
{
function
gradientColoring
(
daclass
)
{
graphResetLabelsAndSizes
()
// full loop
graphResetLabelsAndSizes
()
// full loop
TW
.
gui
.
handpickedcolor
=
true
// strategy on multiple types: color all types that have the attr
let
forTypes
=
getActivetypesNames
().
filter
(
function
(
ty
){
return
daclass
in
TW
.
Facets
[
ty
]
})
// value getter
// value getter
let
getVal
let
getVal
...
@@ -672,9 +674,12 @@ function gradientColoring(daclass) {
...
@@ -672,9 +674,12 @@ function gradientColoring(daclass) {
}
}
var
min_pow
=
0
;
var
min_pow
=
0
;
for
(
var
nid
in
TW
.
Nodes
)
{
for
(
var
k
in
forTypes
)
{
var
the_node
=
TW
.
Nodes
[
nid
]
let
nids
=
TW
.
partialGraph
.
graph
.
getNodesByType
(
var
attval
=
getVal
(
the_node
);
TW
.
catDict
[
forTypes
[
k
]]
)
for
(
var
j
in
nids
)
{
let
attval
=
getVal
(
TW
.
Nodes
[
nids
[
j
]
]);
if
(
!
isNaN
(
parseFloat
(
attval
))
)
{
//is float
if
(
!
isNaN
(
parseFloat
(
attval
))
)
{
//is float
while
(
true
)
{
while
(
true
)
{
var
themult
=
Math
.
pow
(
10
,
min_pow
);
var
themult
=
Math
.
pow
(
10
,
min_pow
);
...
@@ -685,6 +690,7 @@ function gradientColoring(daclass) {
...
@@ -685,6 +690,7 @@ function gradientColoring(daclass) {
}
}
}
}
}
}
}
var
NodeID_Val
=
{}
var
NodeID_Val
=
{}
var
real_min
=
1000000
;
var
real_min
=
1000000
;
...
@@ -692,9 +698,13 @@ function gradientColoring(daclass) {
...
@@ -692,9 +698,13 @@ function gradientColoring(daclass) {
var
themult
=
Math
.
pow
(
10
,
min_pow
);
var
themult
=
Math
.
pow
(
10
,
min_pow
);
// console.log('themult', themult)
// console.log('themult', themult)
for
(
var
nid
in
TW
.
Nodes
)
{
for
(
var
k
in
forTypes
)
{
var
the_node
=
TW
.
Nodes
[
nid
]
let
nids
=
TW
.
partialGraph
.
graph
.
getNodesByType
(
var
attval
=
getVal
(
the_node
)
TW
.
catDict
[
forTypes
[
k
]]
// unordered type names to type id
)
for
(
var
j
in
nids
)
{
let
nid
=
nids
[
j
]
var
attval
=
getVal
(
TW
.
Nodes
[
nid
])
var
attnumber
=
Number
(
attval
);
var
attnumber
=
Number
(
attval
);
if
(
isNaN
(
attnumber
))
{
if
(
isNaN
(
attnumber
))
{
...
@@ -708,6 +718,7 @@ function gradientColoring(daclass) {
...
@@ -708,6 +718,7 @@ function gradientColoring(daclass) {
if
(
round_number
<
real_min
)
real_min
=
round_number
;
if
(
round_number
<
real_min
)
real_min
=
round_number
;
if
(
round_number
>
real_max
)
real_max
=
round_number
;
if
(
round_number
>
real_max
)
real_max
=
round_number
;
}
}
}
// console.log("NodeID_Val", NodeID_Val)
// console.log("NodeID_Val", NodeID_Val)
...
@@ -718,14 +729,21 @@ function gradientColoring(daclass) {
...
@@ -718,14 +729,21 @@ function gradientColoring(daclass) {
// console.log("the mult: "+themult)
// console.log("the mult: "+themult)
// console.log(" - - - - - - - - -- - - ")
// console.log(" - - - - - - - - -- - - ")
// [ Scaling node colours(0-255) and sizes(2-7) ]
// [ Scaling node colours(0-255) and sizes(2-7) ]
var
Min_color
=
0
;
var
Min_color
=
0
;
var
Max_color
=
255
;
var
Max_color
=
255
;
var
Min_size
=
1
;
var
Min_size
=
1
;
var
Max_size
=
8
;
var
Max_size
=
8
;
var
setSize
=
(
TW
.
facetOptions
[
daclass
]
&&
TW
.
facetOptions
[
daclass
].
setsize
)
for
(
var
nid
in
NodeID_Val
)
{
for
(
var
nid
in
NodeID_Val
)
{
var
newval_color
=
Math
.
round
(
(
Min_color
+
(
NodeID_Val
[
nid
][
"round"
]
-
real_min
)
*
((
Max_color
-
Min_color
)
/
(
real_max
-
real_min
))
)
);
var
newval_color
// special case: all nodes have the same size
if
(
real_min
==
real_max
)
{
newval_color
=
0
}
else
{
newval_color
=
Math
.
round
(
(
Min_color
+
(
NodeID_Val
[
nid
][
"round"
]
-
real_min
)
*
((
Max_color
-
Min_color
)
/
(
real_max
-
real_min
))
)
);
}
var
hex_color
=
rgbToHex
(
255
,
(
255
-
newval_color
)
,
0
)
var
hex_color
=
rgbToHex
(
255
,
(
255
-
newval_color
)
,
0
)
let
n
=
TW
.
partialGraph
.
graph
.
nodes
(
nid
)
let
n
=
TW
.
partialGraph
.
graph
.
nodes
(
nid
)
...
@@ -736,7 +754,7 @@ function gradientColoring(daclass) {
...
@@ -736,7 +754,7 @@ function gradientColoring(daclass) {
n
.
customAttrs
.
altgrey_color
=
"rgba("
+
(
hex2rgba
(
hex_color
).
slice
(
0
,
3
).
join
(
','
))
+
",0.4)"
n
.
customAttrs
.
altgrey_color
=
"rgba("
+
(
hex2rgba
(
hex_color
).
slice
(
0
,
3
).
join
(
','
))
+
",0.4)"
// optionally changing size
// optionally changing size
if
(
TW
.
facetOptions
[
daclass
]
&&
TW
.
facetOptions
[
daclass
].
sets
ize
)
{
if
(
setS
ize
)
{
var
newval_size
=
Math
.
round
(
(
Min_size
+
(
NodeID_Val
[
nid
][
"round"
]
-
real_min
)
*
((
Max_size
-
Min_size
)
/
(
real_max
-
real_min
))
)
);
var
newval_size
=
Math
.
round
(
(
Min_size
+
(
NodeID_Val
[
nid
][
"round"
]
-
real_min
)
*
((
Max_size
-
Min_size
)
/
(
real_max
-
real_min
))
)
);
n
.
size
=
newval_size
;
n
.
size
=
newval_size
;
}
}
...
@@ -752,8 +770,11 @@ function gradientColoring(daclass) {
...
@@ -752,8 +770,11 @@ function gradientColoring(daclass) {
// Edge precompute alt_rgb by new source-target nodes-colours combination
// Edge precompute alt_rgb by new source-target nodes-colours combination
repaintEdges
()
repaintEdges
()
// remember in clusters
// remember in clusters of each requested type
let
bins
=
TW
.
Facets
[
getActivetypesNames
()[
0
]][
daclass
]
for
(
var
k
in
forTypes
)
{
let
ty
=
forTypes
[
k
]
TW
.
gui
.
handpickedcolor
[
ty
]
=
true
let
bins
=
TW
.
Facets
[
ty
][
daclass
]
if
(
bins
&&
bins
.
invIdx
)
{
if
(
bins
&&
bins
.
invIdx
)
{
for
(
var
i
in
bins
.
invIdx
)
{
for
(
var
i
in
bins
.
invIdx
)
{
if
(
bins
.
invIdx
[
i
].
labl
!=
'_non_numeric_'
)
{
if
(
bins
.
invIdx
[
i
].
labl
!=
'_non_numeric_'
)
{
...
@@ -778,10 +799,11 @@ function gradientColoring(daclass) {
...
@@ -778,10 +799,11 @@ function gradientColoring(daclass) {
}
}
}
}
}
}
}
// NB legend will group different possible values using
// NB legend will group different possible values using
// precomputed ticks from TW.Facets
.terms
[daclass]
// precomputed ticks from TW.Facets
[type]
[daclass]
set_ClustersLegend
(
daclas
s
)
set_ClustersLegend
(
daclass
,
forType
s
)
TW
.
partialGraph
.
render
();
TW
.
partialGraph
.
render
();
}
}
...
@@ -808,15 +830,27 @@ function repaintEdges() {
...
@@ -808,15 +830,27 @@ function repaintEdges() {
if
(
src
&&
tgt
)
{
if
(
src
&&
tgt
)
{
let
src_color
let
src_color
let
tgt_color
let
tgt_color
if
(
TW
.
gui
.
handpickedcolor
)
{
// handpickedcolor on multiple types may or may not affect
// a given edge so we need the useAltColor individual flag
let
useAlt
=
false
if
(
TW
.
gui
.
handpickedcolor
[
src
.
type
])
{
src_color
=
src
.
customAttrs
.
alt_color
||
'#555'
src_color
=
src
.
customAttrs
.
alt_color
||
'#555'
tgt_color
=
tgt
.
customAttrs
.
alt_color
||
'#555'
useAlt
=
true
}
}
else
{
else
src_color
=
src
.
color
||
'#555'
src_color
=
src
.
color
||
'#555'
tgt_color
=
tgt
.
color
||
'#555'
if
(
TW
.
gui
.
handpickedcolor
[
tgt
.
type
])
{
tgt_color
=
tgt
.
customAttrs
.
alt_color
||
'#555'
useAlt
=
true
}
}
else
tgt_color
=
tgt
.
color
||
'#555'
e
.
customAttrs
.
alt_rgb
=
sigmaTools
.
edgeRGB
(
src_color
,
tgt_color
)
e
.
customAttrs
.
alt_rgb
=
sigmaTools
.
edgeRGB
(
src_color
,
tgt_color
)
e
.
customAttrs
.
useAltColor
=
useAlt
// we don't set e.color because opacity may vary if selected or not
// we don't set e.color because opacity may vary if selected or not
}
}
}
}
...
@@ -833,7 +867,9 @@ function repaintEdges() {
...
@@ -833,7 +867,9 @@ function repaintEdges() {
function
heatmapColoring
(
daclass
)
{
function
heatmapColoring
(
daclass
)
{
var
binColors
var
binColors
var
doModifyLabel
=
false
var
doModifyLabel
=
false
var
actypes
=
getActivetypesNames
()
// let's go
graphResetLabelsAndSizes
()
// full loop
// default value
// default value
let
nColors
=
TW
.
conf
.
legendsBins
||
5
let
nColors
=
TW
.
conf
.
legendsBins
||
5
...
@@ -848,12 +884,16 @@ function heatmapColoring(daclass) {
...
@@ -848,12 +884,16 @@ function heatmapColoring(daclass) {
}
}
}
}
// we have no specifications yet for colors and legends on multiple types
// strategy on multiple types: color all types that have the attr
if
(
actypes
.
length
>
1
)
{
let
forTypes
=
getActivetypesNames
().
filter
(
function
(
ty
){
console
.
warn
(
"colors by bins will only color nodes of type 0"
)
return
daclass
in
TW
.
Facets
[
ty
]
}
})
for
(
var
k
in
forTypes
)
{
var
ty
=
forTypes
[
k
]
var
ty
=
actypes
[
0
]
// global flag
TW
.
gui
.
handpickedcolor
[
ty
]
=
true
// our binning
// our binning
var
tickThresholds
=
TW
.
Facets
[
ty
][
daclass
].
invIdx
var
tickThresholds
=
TW
.
Facets
[
ty
][
daclass
].
invIdx
...
@@ -866,12 +906,6 @@ function heatmapColoring(daclass) {
...
@@ -866,12 +906,6 @@ function heatmapColoring(daclass) {
binColors
=
getHeatmapColors
(
nColors
)
binColors
=
getHeatmapColors
(
nColors
)
// let's go
graphResetLabelsAndSizes
()
// full loop
// global flag
TW
.
gui
.
handpickedcolor
=
true
// use our valueclass => ids mapping
// use our valueclass => ids mapping
for
(
var
k
in
tickThresholds
)
{
for
(
var
k
in
tickThresholds
)
{
...
@@ -910,11 +944,12 @@ function heatmapColoring(daclass) {
...
@@ -910,11 +944,12 @@ function heatmapColoring(daclass) {
// remember
// remember
tickThresholds
[
k
].
col
=
theColor
tickThresholds
[
k
].
col
=
theColor
}
}
}
// Edge precompute alt_rgb by new source-target nodes-colours combination
// Edge precompute alt_rgb by new source-target nodes-colours combination
repaintEdges
()
repaintEdges
()
set_ClustersLegend
(
daclass
)
set_ClustersLegend
(
daclass
,
forTypes
)
TW
.
partialGraph
.
render
();
TW
.
partialGraph
.
render
();
}
}
...
@@ -924,18 +959,25 @@ function clusterColoring(daclass) {
...
@@ -924,18 +959,25 @@ function clusterColoring(daclass) {
graphResetLabelsAndSizes
()
// full loop
graphResetLabelsAndSizes
()
// full loop
let
forTypes
=
getActivetypesNames
().
filter
(
function
(
ty
){
return
daclass
in
TW
.
Facets
[
ty
]
})
// louvain needs preparation
// louvain needs preparation
if
(
daclass
==
"clust_louvain"
)
{
if
(
daclass
==
"clust_louvain"
)
{
if
(
!
TW
.
SystemState
().
LouvainFait
)
{
if
(
!
TW
.
SystemState
().
LouvainFait
)
{
try
{
try
{
RunLouvain
(
)
RunLouvain
(
function
()
{
TW
.
SystemState
().
LouvainFait
=
true
TW
.
SystemState
().
LouvainFait
=
true
clusterColoring
(
"clust_louvain"
)
})
}
}
catch
(
e
)
{
catch
(
e
)
{
TW
.
SystemState
().
LouvainFait
=
false
TW
.
SystemState
().
LouvainFait
=
false
console
.
warn
(
"skipped error on louvain, falling back to default colors"
)
console
.
warn
(
"skipped error on louvain, falling back to default colors"
)
daclass
==
'clust_default'
daclass
==
'clust_default'
}
}
return
}
}
}
}
...
@@ -949,10 +991,9 @@ function clusterColoring(daclass) {
...
@@ -949,10 +991,9 @@ function clusterColoring(daclass) {
}
}
// reset the global state
// reset the global state
TW
.
gui
.
handpickedcolor
=
false
TW
.
gui
.
handpickedcolor
=
{}
}
}
else
{
else
{
let
colList
=
[]
let
colList
=
[]
if
(
TW
.
conf
.
randomizeClusterColors
)
{
if
(
TW
.
conf
.
randomizeClusterColors
)
{
// shuffle on entire array is better than random sorting function on each element
// shuffle on entire array is better than random sorting function on each element
...
@@ -964,8 +1005,10 @@ function clusterColoring(daclass) {
...
@@ -964,8 +1005,10 @@ function clusterColoring(daclass) {
let
nColors
=
TW
.
gui
.
colorList
.
length
let
nColors
=
TW
.
gui
.
colorList
.
length
for
(
var
k
in
forTypes
)
{
let
typeName
=
forTypes
[
k
]
let
facets
=
TW
.
Facets
[
typeName
][
daclass
]
let
facets
=
TW
.
Facets
[
getActivetypesNames
()[
0
]][
daclass
]
if
(
facets
&&
facets
.
invIdx
)
{
if
(
facets
&&
facets
.
invIdx
)
{
for
(
var
i
in
facets
.
invIdx
)
{
for
(
var
i
in
facets
.
invIdx
)
{
let
valGroup
=
facets
.
invIdx
[
i
]
let
valGroup
=
facets
.
invIdx
[
i
]
...
@@ -1003,8 +1046,10 @@ function clusterColoring(daclass) {
...
@@ -1003,8 +1046,10 @@ function clusterColoring(daclass) {
}
}
// fallback on old, slower strategy if scanAttributes inactive
// fallback on old, slower strategy if scanAttributes inactive
else
{
else
{
for
(
var
nid
in
TW
.
Nodes
)
{
let
nids
=
TW
.
partialGraph
.
graph
.
getNodesByType
(
TW
.
catDict
[
typeName
])
var
the_node
=
TW
.
partialGraph
.
graph
.
nodes
(
nid
)
for
(
var
j
in
nids
)
{
let
nid
=
nids
[
j
]
let
the_node
=
TW
.
partialGraph
.
graph
.
nodes
(
nid
)
if
(
the_node
)
{
if
(
the_node
)
{
...
@@ -1033,15 +1078,15 @@ function clusterColoring(daclass) {
...
@@ -1033,15 +1078,15 @@ function clusterColoring(daclass) {
}
}
}
}
}
}
// set the global state
// set the global state
TW
.
gui
.
handpickedcolor
=
true
TW
.
gui
.
handpickedcolor
[
typeName
]
=
true
}
}
}
// Edge precompute alt_rgb by new source-target nodes-colours combination
// Edge precompute alt_rgb by new source-target nodes-colours combination
repaintEdges
()
repaintEdges
()
set_ClustersLegend
(
daclass
)
set_ClustersLegend
(
daclass
,
forTypes
)
TW
.
partialGraph
.
render
();
TW
.
partialGraph
.
render
();
}
}
...
...
twpresets/settings_explorerjs.comex.js
View file @
e5d1e4ec
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
// ...or remote bridge to default source api ajax queries
// ...or remote bridge to default source api ajax queries
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
NGram"
,
"node1"
:
"Document
"
}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
Keywords"
,
"node1"
:
"Scholars
"
}
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
...
@@ -59,7 +59,7 @@ TW.conf = (function(TW){
...
@@ -59,7 +59,7 @@ TW.conf = (function(TW){
TWConf
.
scanAttributes
=
true
TWConf
.
scanAttributes
=
true
// use a facet for default color
// use a facet for default color
TWConf
.
defaultColoring
=
"clust_louvain"
TWConf
.
defaultColoring
=
null
// facetOptions: choose here the default visual result of your node attributes
// facetOptions: choose here the default visual result of your node attributes
// ---------------------------------------------------------------------------
// ---------------------------------------------------------------------------
...
...
twpresets/settings_explorerjs.devdefault.js
View file @
e5d1e4ec
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
...
@@ -21,7 +21,7 @@ TW.conf = (function(TW){
// ...or remote bridge to default source api ajax queries
// ...or remote bridge to default source api ajax queries
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
=
{}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
NGram"
,
"node1"
:
"Document
"
}
TWConf
.
sourceAPI
[
"nodetypes"
]
=
{
"node0"
:
"
Keywords"
,
"node1"
:
"Scholars
"
}
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forNormalQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
TWConf
.
sourceAPI
[
"forFilteredQuery"
]
=
"services/api/graph"
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a 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