GraphQL Visualizer

Run the introspection query against a GraphQL endpoint. Paste the result into the textarea below to view the model relationships.

Introspection Query

query IntrospectionQuery {
  __schema {
    queryType {
      name
    }
    mutationType {
      name
    }
    subscriptionType {
      name
    }
    types {
      ...FullType
    }
    directives {
      name
      description
      args {
        ...InputValue
      }
      onOperation
      onFragment
      onField
    }
  }
}

fragment FullType on __Type {
  kind
  name
  description
  fields(includeDeprecated: true) {
    name
    description
    args {
      ...InputValue
    }
    type {
      ...TypeRef
    }
    isDeprecated
    deprecationReason
  }
  inputFields {
    ...InputValue
  }
  interfaces {
    ...TypeRef
  }
  enumValues(includeDeprecated: true) {
    name
    description
    isDeprecated
    deprecationReason
  }
  possibleTypes {
    ...TypeRef
  }
}

fragment InputValue on __InputValue {
  name
  description
  type {
    ...TypeRef
  }
  defaultValue
}

fragment TypeRef on __Type {
  kind
  name
  ofType {
    kind
    name
    ofType {
      kind
      name
      ofType {
        kind
        name
      }
    }
  }
}

Introspection Result

Introspection Visualization

Download

FAQ

What is GraphQL?
GraphQL.org
Is there a CLI version?
graphqlviz
Source & how to contribute?
Submit an issue or pull request to the project repo
Who made this?
Nathan Smith
What libraries are used?
graphqlviz, Viz.js (GraphViz compiled to JS), Lodash.js, Bootstrap, JQuery
What is the default visualization?
GraphQL wrapper for SWAPI