Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to scale and center a graph so that the whole graph is visible #91

Open
CaptainDario opened this issue Sep 19, 2022 · 4 comments
Open

Comments

@CaptainDario
Copy link

Thank you for the great package!

I am trying to show a graph and I want that it is centered and scaled to a size so that the whole graph is visible.
Is this possible?

This is what I have:
drawing

This is what I would like to have:
drawing

@marcusrohden
Copy link

have you found a solution by any chance?

@shaheer-ahmed-dev
Copy link

is this answered?

@CaptainDario
Copy link
Author

I did it like this

https://github.com/CaptainDario/DaKanji/blob/main/lib/widgets/dictionary/kanji_group_widget.dart#L78

Which results in smth like this

Screenshot_20230916_002317.jpg

@Masadow
Copy link

Masadow commented Feb 24, 2024

I stumbled accross the same issue and here's my solution that is more dynamic (works well when the child graph is smaller than the viewport as well as bigger)

    @override
    Widget build(BuildContext c) {
      return InteractiveViewer(
        constrained: false,
        boundaryMargin: const EdgeInsets.all(100),
        minScale: 0.01,
        maxScale: 5.6,
        child: ConstrainedBox(
          constraints: BoxConstraints(
            minWidth: MediaQuery.of(context).size.width,
            minHeight: MediaQuery.of(context).size.height,
          ),
          child: Center(
            child: GraphView(
              graph: graph,
              algorithm: BuchheimWalkerAlgorithm(builder, TreeEdgeRenderer(builder)),
              paint: Paint()
                ..color = Constant.primaryColor
                ..strokeWidth = 1
                ..style = PaintingStyle.stroke,
              builder: (Node node) => (node as MNode).builder(context, draggedTarget),
            ),
          ),
        ),
      );
    }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants