Color Coding from Meta

[miklevin]

This is maybe a bit weird, but another big win for relatively small effort. Here is my most common pattern in preparing a meta file for Cosmograph.app visualizations:

import pandas as pd
df = pd.read_csv("meta.csv")
df.rename(columns={df.columns[0]: 'id'}, inplace=True)
df["Color"] = "Green"
df.to_csv("meta-colored.csv", index=False)

The prior case I opened addresses the renaming of column 1 to id which I don't think I should have to do.

But this case is about simply adding a color column so I have a way of highlighting which nodes are being influenced by the meta data.

Use case: you have a frequency count and you set node size by meta:frequency. But there's not a frequency for every node, so some get sized by the meta data, and others use the default. And since everything is in the default purple color, the varying size becomes meaningless.

What I do in the above script simply adds a global color to the entire meta file, so things with meta data at all (regardless of the frequency count) get highlighted green. It is profoundly useful for making diagrams that look like medical images, telling the good nodes from the cancer.

Anyhow, I imagine implementation being something like an optional global meta color. It can be at the moment of import, or better still, it could be in Node appearance / node color by: metadata | Custom, with some way to set the custom color.

The lightest touch would be just to throw in a few custom colors in there like Red, Yellow, Green so there's no UI work. That would satisfy my needs, but adjusting the color with a slider would have huge emotional impact for my purposes.

Oh, and as a bonus, permit a color for things that do NOT have entries in the metadata. This is often the "cancer" that needs to be cut away. I will sometimes color-code that black.

[kolmakova]

Hi @miklevin! Have you tried to pass a custom function into nodeColoring config option? I think it should help with your case. You can use it like:

function customColoring(node, clickedNodeIdList) {
 // Define the default color and the global meta color
  const defaultColor = node.color;
  const globalMetaColor = '#00ff00'; // Green

  // Check if the current node has meta data
  if (metaData[node.id]) {
    return globalMetaColor;
  } else {
    return defaultColor;
  }
}

// Usage example:
config.nodeColor = (node) => customColoring(node);
cosmograph.setConfig(config)

You can do same thing with the nodeSize and link props.

[kolmakova]

Oh I got it, it's a question about Cosmograph.app, not Lib 😅. We can add an option for 'unknown' color in the sidebar, but I think it will be implemented only in the next global update of Cosmograph.app that we're planning soon.

[miklevin]

Thanks. I look forward to it.