fix(react) fitViewOptions.nodes are now working as intended

This commit is contained in:
Peter
2023-09-25 13:46:22 +02:00
parent ada5b94673
commit 439916e619
5 changed files with 7 additions and 10 deletions

View File

@@ -221,7 +221,7 @@ const OverviewFlow = () => {
onEdgeMouseLeave={onEdgeMouseLeave}
onEdgeDoubleClick={onEdgeDoubleClick}
fitView
fitViewOptions={{ padding: 0.1, nodes: [{ id: '1' }] }}
fitViewOptions={{ padding: 0.1 /*nodes: [{ id: '1' }]*/ }}
attributionPosition="top-right"
maxZoom={Infinity}
onNodesDelete={onNodesDelete}

View File

@@ -131,7 +131,7 @@
{edgeTypes}
fitView
fitViewOptions={{
padding: 10,
padding: 0.1,
nodes: [
{
id: '1'

View File

@@ -82,7 +82,7 @@ const createRFStore = () =>
let nextFitViewDone = fitViewDone;
if (!fitViewDone && fitViewOnInit) {
nextFitViewDone = fitView({
nextFitViewDone = fitView(nextNodes, {
...fitViewOnInitOptions,
nodes: fitViewOnInitOptions?.nodes || nextNodes,
});
@@ -241,8 +241,8 @@ const createRFStore = () =>
const { transform, width, height, panZoom, translateExtent } = get();
return panBySystem({ delta, panZoom, transform, translateExtent, width, height });
},
fitView: (options?: FitViewOptions): boolean => {
const { panZoom, nodes, width, height, minZoom, maxZoom, nodeOrigin } = get();
fitView: (nodes: Node[], options?: FitViewOptions): boolean => {
const { panZoom, width, height, minZoom, maxZoom, nodeOrigin } = get();
if (!panZoom) {
return false;

View File

@@ -155,7 +155,7 @@ export type ReactFlowActions = {
reset: () => void;
triggerNodeChanges: (changes: NodeChange[]) => void;
panBy: PanBy;
fitView: (options?: FitViewOptions) => boolean;
fitView: (nodes: Node[], options?: FitViewOptions) => boolean;
};
export type ReactFlowState = ReactFlowStore & ReactFlowActions;

View File

@@ -171,7 +171,7 @@ export function fitView<Params extends FitViewParamsBase<NodeBase>, Options exte
options?: Options
) {
const filteredNodes = nodes.filter((n) => {
const isVisible = options?.includeHiddenNodes ? n.width && n.height : !n.hidden;
const isVisible = n.width && n.height && (options?.includeHiddenNodes || !n.hidden);
if (options?.nodes?.length) {
return isVisible && options?.nodes.some((optionNode) => optionNode.id === n.id);
@@ -180,11 +180,8 @@ export function fitView<Params extends FitViewParamsBase<NodeBase>, Options exte
return isVisible;
});
console.log(filteredNodes);
if (filteredNodes.length > 0) {
const bounds = getRectOfNodes(filteredNodes, nodeOrigin);
console.log(bounds);
const [x, y, zoom] = getTransformForBounds(
bounds,