Importing a GraphQL schema from a file

In this section we will look at the ability to import a GraphQL schema from a file.

In the demonstration we will use the StarWars schema. If you want to try the procedure, save the file from the page:

Import from file

To load an existing GraphQL schema, go to the Projects section and click the Import file button.

Importing a GraphQL schema from a file.

After you select the saved schema.graphql file it will be loaded and the project will be created including the visualization of the GraphQL schema.

Imported GraphQL schema and visualization in the form of a diagram.

You now have an overview of the loaded objects such as types, interfaces, enums and more. Everything is also displayed in the main diagram graphically and the objects are placed in the diagram automatically. If you want to change the layout of the objects in the diagram, you can use the three auto-layout features and choose the most suitable visualization method for you. In many cases, it is best to manually reposition the objects according to some logical units. Additional options for modifying the GraphQL diagram schema are listed in the following section.

Modifying the visualization of a GraphQL diagram

You can change the color of the objects quite easily for a better understanding of the logical units. To do this, you can use the Copy/Apply format feature. This feature allows you to select one object, set the text or background color, and then apply these settings to other selected objects.

Copy and apply format.

Splitting the GraphQL diagram into sub-diagrams

If you want to focus, for example, only on a certain part of the GraphQL diagram, you can select objects and add them to a new sub-diagram.

Splitting the GraphQL diagram into sub-diagrams

Note: This feature is only available in the Professional edition. More information can be found here.

The following gallery shows a project with multiple diagrams, each of which contains a specific part of the main diagram.

Larger GraphQL diagrams

We have made numerous performance optimizations that make it possible to visualize more complex GraphQL diagram structures. Here you can see a sample GitHub diagram that can be downloaded from the site:

As you can see, this GraphQL schema contains more than 1000 objects (types, inputs, interfaces, enums…) and more than 2000 references (references, implements).

larger GraphQL diagram

For future versions we plan even more features like automatic splitting into sub-diagrams and further optimization for better user experience and performance.

Quick links

Download Buy Now!

Blog Categories
Blog by Platforms