From fbbd0a93ba8b92814146bd36fefe2196c82767f2 Mon Sep 17 00:00:00 2001 From: moklick Date: Tue, 6 Aug 2019 11:36:53 +0200 Subject: [PATCH] refactor(minimap): show partial nodes --- dist/ReactGraph.js | 9 +++++++-- example/SimpleGraph.js | 10 ++++++---- example/build/example.e31bb0bc.js | 16 +++++++++++----- example/build/example.e31bb0bc.js.map | 2 +- example/build/index.js | 2 +- src/Plugins/MiniMap/index.js | 2 +- src/graph-utils.js | 12 ++++++++---- 7 files changed, 35 insertions(+), 18 deletions(-) diff --git a/dist/ReactGraph.js b/dist/ReactGraph.js index f625ef8f..9bf2842c 100644 --- a/dist/ReactGraph.js +++ b/dist/ReactGraph.js @@ -29889,6 +29889,7 @@ }; var getNodesInside = function getNodesInside(nodes, bbox) { var transform = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [0, 0, 1]; + var partially = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false; return nodes.filter(function (n) { var bboxPos = { x: (bbox.x - transform[0]) * (1 / transform[2]), @@ -29900,7 +29901,11 @@ position = _n$__rg.position, width = _n$__rg.width, height = _n$__rg.height; - return position.x > bboxPos.x && position.x + width < bboxPos.x + bboxWidth && position.y > bboxPos.y && position.y + height < bboxPos.y + bboxHeight; + var nodeWidth = partially ? -width : width; + var nodeHeight = partially ? 0 : height; + var offsetX = partially ? width : 0; + var offsetY = partially ? height : 0; + return position.x + offsetX > bboxPos.x && position.x + nodeWidth < bboxPos.x + bboxWidth && position.y + offsetY > bboxPos.y && position.y + nodeHeight < bboxPos.y + bboxHeight; }); }; var getConnectedEdges = function getConnectedEdges(nodes, edges) { @@ -33681,7 +33686,7 @@ React.useEffect(function () { if (canvasNode) { var ctx = canvasNode.current.getContext('2d'); - var nodesInside = getNodesInside(state.nodes, bbox, state.transform); + var nodesInside = getNodesInside(state.nodes, bbox, state.transform, true); ctx.fillStyle = bgColor; ctx.fillRect(0, 0, width, height); nodesInside.forEach(function (n) { diff --git a/example/SimpleGraph.js b/example/SimpleGraph.js index 088c24f3..00a2aff5 100644 --- a/example/SimpleGraph.js +++ b/example/SimpleGraph.js @@ -77,7 +77,7 @@ class App extends PureComponent { { source: '2', target: '3' }, { source: '3', target: '4', type: 'step' }, { source: '3', target: '5' }, - { source: '5', target: '6', type: 'straight', animated: true, style: { stroke: '#FFCC00' } }, + { source: '5', target: '6', type: 'step', animated: true, style: { stroke: '#FFCC00' } }, { source: '6', target: '7', style: { stroke: '#FFCC00' }}, ] }; @@ -166,9 +166,11 @@ class App extends PureComponent { { - if (n.type === 'input') return 'blue' - if (n.type === 'output') return 'green' - return 'red'; + if (n.type === 'input') return 'blue'; + if (n.type === 'output') return 'green'; + if (n.type === 'default') return 'red'; + + return '#FFCC00'; }} />