19
19
integrity ="sha512-yocoLferfPbcwpCMr8v/B0AB4SWpJlouBwgE0D3ZHaiP1nuu5djZclFEIj9znuqghaZ3tdCMRrreLoM8km+jIQ== "
20
20
crossorigin ="anonymous "> </ script >
21
21
< script src ="https://cdn.plot.ly/plotly-latest.min.js "> </ script >
22
+ < script src ="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js " referrerpolicy ="no-referrer "> </ script >
22
23
< title > Citation network explorer</ title >
23
24
< style >
24
25
html ,
105
106
</ head >
106
107
107
108
< body >
108
- < h1 id ="title "> < span id ="subtitle "> < span id ="name "> Giovanni </ span > 's citation network</ span > < span id ="year "> </ span >
109
+ < h1 id ="title "> < span id ="subtitle "> < span id ="name "> Dan </ span > 's citation network</ span > < span id ="year "> </ span >
109
110
</ h1 >
110
111
< div id ="network "> </ div >
111
112
< select id ="search " placeholder ="type to search... " class ="form-control autocomplete "> </ select >
@@ -114,15 +115,15 @@ <h1 id="title"><span id="subtitle"><span id="name">Giovanni</span>'s citation ne
114
115
< div class ="small "> Hover over the timeline to filter the network graph by year< br > Click to hold</ div >
115
116
Colour by
116
117
< select id ="color ">
117
- < option value ="citation_count " selected > Citation count</ option >
118
+ < option value ="cited_by_count " selected > Citation count</ option >
118
119
< option value ="n_authors "> Number of authors</ option >
119
120
< option value ="n_inst "> Number of institutions</ option >
120
121
< option value ="field "> Primary field</ option >
121
122
</ select > < div id ="legend "> </ div > < br >
122
123
Size by
123
124
< select id ="size ">
124
125
< option value =""> Constant</ option >
125
- < option value ="citation_count " selected > Citation count</ option >
126
+ < option value ="cited_by_count " selected > Citation count</ option >
126
127
< option value ="n_authors "> Number of authors</ option >
127
128
< option value ="n_inst "> Number of institutions</ option >
128
129
< option value ="n_fields "> Number of fields</ option >
@@ -310,10 +311,9 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
310
311
var visible_nodes = nodes . map ( n => n . id )
311
312
var edges = [ ] ;
312
313
for ( var node of nodes ) {
313
- for ( var rid in node . references ) {
314
- rid = parseInt ( rid ) ;
314
+ for ( var rid of node . referenced_works ) {
315
315
if ( visible_nodes . includes ( rid ) ) {
316
- edges . push ( { source : node . id , target : rid , count : node . references [ rid ] } )
316
+ edges . push ( { source : node . id , target : rid } )
317
317
}
318
318
}
319
319
}
@@ -322,7 +322,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
322
322
const urlParams = new URLSearchParams ( window . location . search ) ;
323
323
var data = urlParams . get ( 'data' ) ;
324
324
if ( ! data ) {
325
- data = "data/Giovanni .json"
325
+ data = "data/Dan .json"
326
326
} else if ( data == "Decolonizing_Methodologies" ) {
327
327
$ ( "#subtitle" ) . text ( "Influence of Decolonizing Methodologies" )
328
328
data = "Decolonizing_Methodologies/data.json"
@@ -333,7 +333,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
333
333
function summarise_by_year ( data ) {
334
334
var time_data = { }
335
335
for ( var node of data ) {
336
- var d = node . date_published . slice ( 0 , 4 )
336
+ var d = node . publication_year ;
337
337
if ( ! time_data [ d ] ) time_data [ d ] = 0 ;
338
338
time_data [ d ] ++ ;
339
339
}
@@ -343,26 +343,15 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
343
343
console . log ( data ) ;
344
344
window . data = data ;
345
345
window . current_data = data ;
346
+ // Used for grouping
346
347
window . paper_lookup = { }
348
+ // Quick built in summary stats for colorscale/size changes
347
349
for ( var node of data ) {
348
350
paper_lookup [ node . id ] = node
349
- var tmp = { }
350
- for ( var rid of node . references ) {
351
- tmp [ rid ] = 1
352
- }
353
- node . references = tmp ;
354
- if ( node . authors ) {
355
- node . n_authors = node . authors . length ;
356
- node . n_inst = uniq ( node . authors . map ( a => a . DAfN ) ) . length ;
357
- }
358
- if ( node . fields ) {
359
- node . field = node . fields [ 0 ] . DFN ;
360
- node . n_fields = node . fields . length ;
361
- }
362
- if ( node . journal ) {
363
- node . journal . JN = node . journal . JN . toUpperCase ( )
364
- node . journals = [ node . journal ]
365
- }
351
+ node . n_authors = node . authorships . length ;
352
+ node . n_inst = uniq ( node . authorships . map ( a => a . institutions . length ? a . institutions [ 0 ] . display_name : "" ) ) . length
353
+ node . n_fields = node . concepts . length
354
+ node . field = node . concepts [ 0 ] . display_name
366
355
}
367
356
368
357
var time_data = summarise_by_year ( data ) ;
@@ -393,7 +382,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
393
382
}
394
383
395
384
Plotly . newPlot ( 'timeline' , plotData , layout ) ;
396
- window . year = 2021
385
+ window . year = 2023
397
386
window . freeze = false ;
398
387
$ ( "#timeline" ) . on ( 'plotly_hover' , function ( event , data ) {
399
388
if ( window . freeze ) return ;
@@ -410,7 +399,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
410
399
if ( window . year == d . x ) return ;
411
400
window . year = d . x ;
412
401
console . log ( year )
413
- var filtered_data = window . current_data . filter ( n => n . date_published . slice ( 0 , 4 ) <= year )
402
+ var filtered_data = window . current_data . filter ( n => n . publication_year <= year )
414
403
console . log ( filtered_data )
415
404
$ ( "#year" ) . text ( "as at " + year ) ;
416
405
graph . graphData ( {
@@ -446,7 +435,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
446
435
console . log ( d )
447
436
if ( window . year == d . x ) return ;
448
437
window . year = d . x
449
- var filtered_data = window . current_data . filter ( n => n . date_published . slice ( 0 , 4 ) <= year )
438
+ var filtered_data = window . current_data . filter ( n => n . publication_year <= year )
450
439
console . log ( filtered_data )
451
440
$ ( "#year" ) . text ( "as at " + year ) ;
452
441
graph . graphData ( {
@@ -455,17 +444,18 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
455
444
} )
456
445
} ) ;
457
446
458
- var scale = colorscale ( data . map ( n => n . citation_count ) )
447
+ var scale = colorscale ( data . map ( n => n . cited_by_count ) )
459
448
460
449
function generateHTMLTooltip ( node , include_title = true ) {
450
+ console . log ( node )
461
451
result = ""
462
452
if ( include_title ) {
463
- result += `<b>${ node . title } (${ node . date_published } )</b><br>` ;
453
+ result += `<b>${ node . title } (${ node . publication_date } )</b><br>` ;
464
454
}
465
- result += `${ node . authors . map ( a => a . DAfN ? a . DAuN + " (" + a . DAfN + ")" : a . DAuN ) . join ( "," ) } <br>
466
- ${ node . journal ? node . journal . JN : "" } <br>
467
- ${ node . fields . map ( f => f . DFN ) . join ( "," ) } <br>
468
- Citation count: ${ node . citation_count } <br>`
455
+ result += `${ node . authorships . map ( a => a . institutions . length ? a . author . display_name + " (" + a . institutions [ 0 ] . display_name + ")" : a . author . display_name ) . join ( "," ) } <br>
456
+ ${ node . primary_location . source ? node . primary_location . source . display_name : node . primary_location . landing_page_url } <br>
457
+ ${ node . concepts . map ( c => c . display_name ) . join ( "," ) } <br>
458
+ Citation count: ${ node . cited_by_count } <br>`
469
459
return result ;
470
460
}
471
461
@@ -476,8 +466,8 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
476
466
links : getEdges ( data )
477
467
} )
478
468
. enableNodeDrag ( false )
479
- . nodeVal ( 'citation_count ' )
480
- . nodeColor ( n => scale ( n . citation_count ) . css ( ) )
469
+ . nodeVal ( 'cited_by_count ' )
470
+ . nodeColor ( n => scale ( n . cited_by_count ) . css ( ) )
481
471
. nodeLabel ( node => `<div class="nodetooltip">${ generateHTMLTooltip ( node ) } </div>` )
482
472
. onNodeHover ( node => elem . style . cursor = node ? 'pointer' : null )
483
473
. onNodeClick ( node => {
@@ -491,17 +481,10 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
491
481
3000 // ms transition duration
492
482
) ;
493
483
$ ( ".nodetooltip" ) . remove ( )
494
- var doilink = "https://doi.org/" + node . DOI ;
495
- var links = [ ] ;
496
- for ( var s of node . source ) {
497
- s . domain = ( new URL ( s . U ) ) . hostname . replace ( 'www.' , '' )
498
- links . push ( `<a href="${ s . U } ">${ s . domain } </a>` ) ;
499
- }
500
- links = links . join ( " | " )
501
- $ ( "#modal-title" ) . text ( `${ node . title } (${ node . date_published } ))` ) ;
484
+ var doilink = node . doi ;
485
+ $ ( "#modal-title" ) . text ( `${ node . title } (${ node . publication_date } ))` ) ;
502
486
$ ( "#modal-body" ) . html ( `${ generateHTMLTooltip ( node , false ) }
503
- <a href="${ doilink } ">${ doilink } </a><br>
504
- ${ links } <br>` ) ;
487
+ <a href="${ doilink } ">${ doilink } </a><br>` ) ;
505
488
$ ( "#modal" ) . modal ( 'show' )
506
489
} )
507
490
$ ( "#spinner" ) . hide ( ) ;
@@ -527,58 +510,56 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
527
510
window . group = this . value ;
528
511
if ( this . value == "paper" ) {
529
512
window . current_data = data ;
530
- var filtered_data = data . filter ( n => n . date_published . slice ( 0 , 4 ) <= d )
513
+ var filtered_data = data . filter ( n => n . publication_year <= d )
531
514
graph . graphData ( {
532
515
nodes : filtered_data ,
533
516
links : getEdges ( filtered_data )
534
517
} ) . nodeLabel ( node => `<div class="nodetooltip">${ generateHTMLTooltip ( node ) } </div>` )
535
518
return ;
536
519
}
537
520
if ( this . value == "author" ) {
538
- var objkey = "authors "
539
- var subkey = "AuId "
540
- var namekey = "DAuN "
521
+ var objkey = "authorships "
522
+ var subkey = "author.id "
523
+ var namekey = "author.display_name "
541
524
} else if ( this . value == "inst" ) {
542
- var objkey = "authors "
543
- var subkey = "AfId "
544
- var namekey = "DAfN "
525
+ var objkey = "authorships "
526
+ var subkey = "institutions[0].id "
527
+ var namekey = "institutions[0].display_name "
545
528
} else if ( this . value == "field" ) {
546
- var objkey = "fields "
547
- var subkey = "FId "
548
- var namekey = "DFN "
529
+ var objkey = "concepts "
530
+ var subkey = "id "
531
+ var namekey = "display_name "
549
532
} else if ( this . value == "journal" ) {
550
- var objkey = "journals "
551
- var subkey = "JId "
552
- var namekey = "JN "
533
+ var objkey = "locations "
534
+ var subkey = "source.id "
535
+ var namekey = "source.display_name "
553
536
}
554
537
var groupedData = { } ;
555
538
for ( var node of data ) {
556
- if ( ! node [ objkey ] ) continue ;
557
539
var seen_ids_this_node = { }
558
540
for ( var obj of node [ objkey ] ) {
559
- var id = obj [ subkey ]
541
+ var id = _ . get ( obj , subkey )
560
542
if ( ! id || seen_ids_this_node [ id ] ) continue
561
543
seen_ids_this_node [ id ] = true
562
544
if ( ! groupedData [ id ] ) {
563
545
groupedData [ id ] = {
564
546
id : id ,
565
- citation_count : 0 ,
566
- name : obj [ namekey ] ,
567
- date_published : node . date_published ,
568
- references : { }
547
+ cited_by_count : 0 ,
548
+ name : _ . get ( obj , namekey ) ,
549
+ date_published : node . publication_date ,
550
+ referenced_works : [ ]
569
551
}
570
552
}
571
- groupedData [ id ] . citation_count += node . citation_count
572
- if ( groupedData [ id ] . date_published > node . date_published ) groupedData [ id ] . date_published = node . date_published ;
573
- for ( var ref in node . references ) {
574
- ref = parseInt ( ref )
553
+ groupedData [ id ] . cited_by_count += node . cited_by_count
554
+ if ( groupedData [ id ] . publication_date > node . publication_date ) groupedData [ id ] . publication_date = node . publication_date ;
555
+ for ( var ref of node . referenced_works ) {
575
556
var paper = paper_lookup [ ref ] ;
557
+ if ( ! paper ) continue
576
558
if ( ! paper [ objkey ] ) continue
577
559
for ( var other of paper [ objkey ] ) {
578
- var otherId = other [ subkey ]
560
+ var otherId = _ . get ( other , subkey )
579
561
if ( ! otherId ) continue
580
- if ( ! groupedData [ id ] . references [ otherId ] ) groupedData [ id ] . references [ otherId ] = 0 ;
581
- groupedData [ id ] . references [ otherId ] ++ ;
562
+ if ( ! groupedData [ id ] . referenced_works . includes ( otherId ) ) groupedData [ id ] . referenced_works . push ( otherId )
582
563
}
583
564
}
584
565
}
@@ -594,7 +575,7 @@ <h5 id="modal-title" class="modal-title" id="exampleModalLongTitle"></h5>
594
575
graph . graphData ( {
595
576
nodes : filteredData ,
596
577
links : getEdges ( filteredData )
597
- } ) . nodeLabel ( n => `<div class="nodetooltip">${ n . name } <br>Citations: ${ n . citation_count } </div>` )
578
+ } ) . nodeLabel ( n => `<div class="nodetooltip">${ n . name } <br>Citations: ${ n . cited_by_count } </div>` )
598
579
. linkAutoColorBy ( e => e . count )
599
580
. linkWidth ( e => e . count )
600
581
} )
0 commit comments