Graphistry 2.31.24: Graph customization

Posted by Graphistry Staff on September 29, 2020

Graphistry 2.31.24 is now live! You can explore relationships in data with GPU visual graph analytics for free on Graphistry Hub, download the latest Docker files as an enterprise user, and working their way through AWS and Azure Marketplaces, one-click launch the latest private VM in your own account (including our new GovCloud mode).

Launch

The most requested features in 2.31.24 are custom theming and the automatic interactive legend. In addition, check out the release notes for improved Neo4j 4 support, investigation templating, and overall performance and stability improvements.

Custom Theming: Logo and style


Custom theming in action for Les Miserables

Custom theming helps you share more amazing visualizations and make embedding more seamless. It provides several configuration areas: Logo, foreground/background, and visual encodings. As a fun example, the above screenshot for how Les Miserable characters interact takes advantage of each of these.

The setup is Graphistry as usual, whether via REST, Python, or any other client library of choice:

#! pip install --user graphistry pandas
import graphistry, pandas as pd
edges_df = pd.read_csv('https://raw.githubusercontent.com/graphistry/pygraphistry/master/demos/data/lesmiserables.csv')
g = graphistry.edges(edges_df).bind(source='source', destination='target')

Brand: Custom logo, page title, and background

Whether for your project or your organization, share visualizations that include your logo and provide a more recognizable browser tab:

g = g.addStyle(
  page={
    'favicon': 'https://www.izadesign.com/images/designs/logo-386l1_all_large.jpg',
    'title': 'Les Miserables character interactions'
  },
  logo={
    'url': 'https://www.izadesign.com/images/designs/logo-386l1_all_large.jpg',
    'dimensions': {'maxWidth': 200, 'maxHeight': 200},
    'position': 'top',
    'padding': { 'top': 30 }})

We can likewise set foreground and background effects. Gradients and blending modes are especially fun:

g = g.addStyle(
    fg={'blendMode': 'luminosity'},
    bg={
      'color': '#FFF',
      'image': {
        'url': 'https://img.pngio.com/les-miserables-school-edition-polaris-productions-les-miserable-png-1500_1500.png',
        'blendMode': 'lighten'
      },
      'gradient': {
          'kind': 'radial',
          'position': 'circle at top center',
          'stops': [ 
              ['rgba(255,255,255,0)', '0%'],
              ['rgba(255,0,0,0.2)', '10%'], ['rgba(0,0,255,0.2)', '60%'],
            ['rgba(0,0,255,0.2)', '80%'], ['rgba(153,0,153,0.2)', '90%'] ]}}

Complex encodings

Mapping data to visual attributes with encodings also just got easier. Want colors to go cold to hot based on some timestamp, or map different node type properties to different icons? You can now directly do so with complex encodings:

g = g.encode_edge_color('time', ["blue", "yellow", "red"], as_continuous=True)
g = g.encode_edge_icon('device', categorical_mapping={
    'mac': 'laptop',
    'macbook': 'server'
})

As before, you can dynamically change colors in-tool without any coding. Likewise, developers can use predefined palettes or specify specific colors, and for simpler encodings, directly bind them.

Interactive Legend

Interactive legend

Graphistry follows the philosophy of “give an inch, get a mile”. As soon as you include a property named `type` for your nodes, the interactive legend appears and uses it. It will detail which encodings are active, making it easier for users to read visualizations for the first time. Legends combine especially well with the new complex encodings feature.

Have an interesting dataset? Try for yourself on Graphistry Hub or one-click launch a private instance for your own private data!

Launch