algairim commented on a change in pull request #255:
URL: https://github.com/apache/brooklyn-ui/pull/255#discussion_r674565692
##########
File path: ui-modules/blueprint-composer/app/components/util/d3-blueprint.js
##########
@@ -838,11 +827,77 @@ export function D3Blueprint(container, options) {
return `M ${sourceNode.x},${sourceY} A ${dr},${dr} 0
0,${sweep} ${m.x},${m.y}`;
});
- relationData.exit()
+ relationArcs.exit()
.transition()
.duration(_configHolder.transition)
.attr('opacity', 0)
.remove();
+
+ // ====== RELATIONSHIP LABELS =========
+ // Draw relationship labels that follow paths, somewhere in the middle
of paths.
+ // NOTE <textPath/> DECREASES THE UI PERFORMANCE, USE LABELS WITH
CAUTION.
+
+ _relationLabels.selectAll('.relation-label').remove(); // Re-draw
labels every time, required to refresh changes.
+
+ // Group unique labels per path.
+ let labelsPerPath = {};
+ _d3DataHolder.visible.relationships.forEach(d => {
+ const key = getPathId(d);
+ if (!labelsPerPath[key]) {
+ labelsPerPath[key] = new Set();
+ }
+ labelsPerPath[key].add(d.label);
+ });
+
+ const getLabelOffset = (d) => {
+ let labelIndex =
Array.from(labelsPerPath[getPathId(d)]).indexOf(d.label);
+ return labelIndex > 0 ? labelIndex * -12 : 0;
+ };
+
+ let labelsData =
Object.values(_d3DataHolder.visible.relationships.reduce((accumulator, d) => {
+ const key = getPathId(d) + d.label;
+ accumulator[key] = {
+ source: d.source,
+ target: d.target,
+ pathSelector: d.pathSelector,
+ labelSelector: d.labelSelector,
+ label: d.label
+ };
+ return accumulator;
+ }, {}));
+
+ let relationLabelsEntered =
_relationLabels.selectAll('.relation-label').data(labelsData).enter();
+
+ // TODO: limit the number of labels that can be displayed for a path.
Consider displaying up to 2-3 labels and
+ // if there are more relationships in a single path - display '+
N others' at the end.
Review comment:
@tbouron, this is to address as per your suggestion. Either now or later
- to agree with @ahgittin.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
