Rendering nodes and labels - view-a-LOD/Valeros GitHub Wiki

Nodes are typically rendered using the node-link component (components/node/node-link). Basic usage:

<app-node-link [url]="id" />

This is a "smart" component, in the sense that it retrieves its own label if no label is passed through the label input property (see the Label retrieval and caching section below). Of course, you can also set the node's label explicitly:

<app-node-link [url]="id" [label]="label" />

If you want to render a node and its label, but do not want to make it clickable, use the disabled property:

<app-node-link [url]="id" [disabled]="true" />

Label highlighting

_Files/Pasted image 20240711131817.png

By default, node labels are highlighted when there's an exact match with the search service's (services/search.service.ts) query string (queryStr).

You can turn off this behavior through the node-link component's shouldHighlight property:

<app-node-link [url]="id" [shouldHighlight]="false" />

[!TIP] If you want to change highlighting functionality (e.g., making use of a fuzzy match) see the node-label component's (components/node/node-label) getLabelWithHighlightsHtml function for the implementation.

Label retrieval and caching

To prevent excessive triple store label requests for each single rendered node, node label requests are batched and locally cached during the user's session.

All node labels are retrieved from the node-link component's cachedLabel getter, through the cache service (services/cache.service.ts).

In the cache service, an async loop checks every X ms (X is configurable in config/settings.ts, in the uiSettings field) if there are new labels to retrieve.