vega-forcedirected.json

{'$schema': 'https://vega.github.io/schema/vega/v5.json',
 'width': 500,
 'height': 500,
 'padding': 0,
 'autosize': 'none',
 'signals': [{'name': 'cx', 'update': 'width / 2'},
  {'name': 'cy', 'update': 'height / 2'},
  {'description': 'State variable for active node dragged status.',
   'name': 'dragged',
   'value': 0,
   'on': [{'events': 'symbol:mouseout[!event.buttons], window:mouseup',
     'update': '0'},
    {'events': 'symbol:mouseover', 'update': 'dragged || 1'},
    {'events': '[symbol:mousedown, window:mouseup] > window:mousemove!',
     'update': '2',
     'force': True}]},
  {'description': 'Graph node most recently interacted with.',
   'name': 'dragged_node',
   'value': None,
   'on': [{'events': 'symbol:mouseover',
     'update': 'dragged === 1 ? item() : dragged_node'}]},
  {'description': 'Flag to restart Force simulation upon data changes.',
   'name': 'restart',
   'value': False,
   'on': [{'events': {'signal': 'dragged'}, 'update': 'dragged > 1'}]},
  {'name': 'freeze', 'bind': {'input': 'checkbox'}, 'value': True},
  {'name': 'nbody-strength',
   'bind': {'input': 'range', 'min': -20, 'max': 3, 'step': 1},
   'value': -1},
  {'name': 'collide-radius',
   'bind': {'input': 'range', 'min': 0, 'max': 5, 'step': 0.2},
   'value': 3},
  {'name': 'link-distance',
   'bind': {'input': 'range', 'min': 5, 'max': 50, 'step': 1},
   'value': 20}],
 'data': [{'name': 'node-data',
   'values': [{'id': 1, 'category': 1}, {'id': 1, 'category': 1}]},
  {'name': 'link-data', 'values': [{'source': 0, 'target': 1}]}],
 'scales': [{'name': 'colourScale',
   'type': 'ordinal',
   'domain': {'data': 'node-data', 'field': 'community'},
   'range': {'scheme': 'category10'}}],
 'marks': [{'name': 'nodes',
   'type': 'symbol',
   'zindex': 1,
   'from': {'data': 'node-data'},
   'on': [{'trigger': 'dragged',
     'modify': 'dragged_node',
     'values': 'dragged === 1 ? {fx:dragged_node.x, fy:dragged_node.y} : {fx:x(), fy:y()}'},
    {'trigger': '!dragged',
     'modify': 'dragged_node',
     'values': '{fx: null, fy: null}'}],
   'encode': {'enter': {'fill': {'field': 'community', 'scale': 'colourScale'},
     'fillOpacity': {'value': 0.5},
     'stroke': {'field': 'community', 'scale': 'colourScale'},
     'size': {'value': 50},
     'tooltip': {'field': 'first_diagnosis'}},
    'update': {'cursor': {'value': 'pointer'}}},
   'transform': [{'type': 'force',
     'iterations': 300,
     'velocityDecay': 0.4,
     'restart': {'signal': 'restart'},
     'static': {'signal': 'freeze'},
     'forces': [{'force': 'center',
       'x': {'signal': 'cx'},
       'y': {'signal': 'cy'}},
      {'force': 'collide', 'radius': {'signal': 'collide-radius'}},
      {'force': 'nbody', 'strength': {'signal': 'nbody-strength'}},
      {'force': 'link',
       'links': 'link-data',
       'distance': {'signal': 'link-distance'}}]}]},
  {'type': 'path',
   'from': {'data': 'link-data'},
   'interactive': False,
   'encode': {'update': {'stroke': {'value': 'lightgrey'}}},
   'transform': [{'type': 'linkpath',
     'shape': 'line',
     'sourceX': 'datum.source.x',
     'sourceY': 'datum.source.y',
     'targetX': 'datum.target.x',
     'targetY': 'datum.target.y'}]}]}