Time saving tricks with lists, colors, grids, and guides

Sometimes in life it's the little things that count. And in that spirit here are three little features we hope put a smile on your face:

Automatic lists of elements, connections and loops

This one's especially useful for you system mappers out there. Say you have a map like the one below with 20+ loops. You'd love to include links to each of the loops in the sidebar but creating them each by hand seems like such a time sink...

Welcome our newest widget: the list!

Simply drop [[list/loops]] in the map overview and you'll instantly have an ordered list of all the loops in your map. Hover over the loop to zoom on that loop or click to go to the loop profile.

And yes - it works for elements and connections as well.

The categorize function and named color scales

If you're a Kumu expert, you might have seen this one in last week's community detection release. The new categorize() function lets you automatically assign colors (using named color scales) based on values in an attribute.

Here's the code to make it happen:

@settings {
  element-color: categorize("element type", spectral);
}

// NOTE: categorize can also be used within rules!
connection {
  color: categorize("level of influence", heat);
}

For categorize() to work, the attribute needs to be a single value attribute. This means it is great for types, communities, and any other attributes where an element or connection only has one value assigned.

You can also use named color scales in the scale() function:

element {
  color: scale("net worth", bujumbra);
}

Check out the color reference for the complete guide.

Alignment grids

While we can't automatically position your elements in a straight line or circle (yet), we can help you position them manually in the meantime.

Drop the code below into your advanced perspective editor to see what's possible and then tweak the settings to get just the guides you want. You can add as many x, y, and circle guides as you need.

@settings {
  grid: on;
  grid-width: 2;    // line width
  grid-offset: 20;  // spacing between lines
  grid-color: #999;
  guides: x(0) y(0) circle(100);
  guide-width: 4;
  guide-color: #333;
}