175
175
</b-tooltip >
176
176
</div >
177
177
<div >
178
- <b-tooltip label =" menu for selecting networks" type =" is-light" multilined >
179
- <b-dropdown v-model =" showEdgetType" class =" is-right" aria-role =" list" >
180
- <button class =" button is-light" slot =" trigger" >
181
- <b-icon icon =" bars" ></b-icon >
182
- </button >
183
- <!-- need to fix the below -->
184
- <b-dropdown-item v-for =" ( n, index ) in networks" :key =" index" :value =" n" @click =" setEdge(n)" >
185
- <font color =" #202020" >{{ n }}</font >
186
- </b-dropdown-item >
187
- </b-dropdown >
188
- </b-tooltip >
178
+ <b-dropdown v-model =" showEdgeType" aria-role =" list" :triggers =" ['hover']" >
179
+ <b-button label =" Link Type" type =" is-light" slot =" trigger" />
180
+ <b-dropdown-item v-for =" ( n, index ) in networks" :key =" index" :value =" n" aria-role =" listitem" >
181
+ <font color =" #202020" >{{ n }}</font >
182
+ </b-dropdown-item >
183
+ </b-dropdown >
189
184
</div >
190
185
<div class =" column" />
191
186
</div >
@@ -552,9 +547,7 @@ export default {
552
547
return ;
553
548
}
554
549
555
- const nodes = this .nodes .map ( d => Object .create ( d ) );
556
- // const links = this.edges.map( d => Object.create( d ) );
557
-
550
+ const nodes = this .nodes ;
558
551
const links = this .edges .filter ( (d ) => {
559
552
switch ( this .showEdgeType ) {
560
553
case ' all' : {
@@ -571,7 +564,7 @@ export default {
571
564
}
572
565
}, this );
573
566
574
- const width = 600 ;
567
+ const width = 600 ;
575
568
const height = 400 ;
576
569
577
570
const simulation = d3 .forceSimulation ( nodes )
@@ -936,6 +929,10 @@ export default {
936
929
this .generateGraph ();
937
930
this .generateChord ();
938
931
}
932
+ },
933
+
934
+ showEdgeType : function () {
935
+ this .generateGraph ();
939
936
}
940
937
},
941
938
@@ -981,4 +978,8 @@ export default {
981
978
.modal-card-title {
982
979
color : whitesmoke ;
983
980
}
981
+
982
+ .dropdown-item.is-active {
983
+ background-color : whitesmoke ;
984
+ }
984
985
</style >
0 commit comments