Explore arquivos JSON como grafos interativos ao lado do editor nativo do Visual Studio Code. Objetos viram cartões, arrays viram ramificações e cada valor continua conectado ao trecho original do arquivo.
Como usar
Abra um arquivo .json no VS Code; extensões em maiúsculas ou mistas, como .JSON e .Json, também são aceitas.
Execute Magic JSON: Abrir visualização pela paleta (Ctrl+Shift+P), pelo menu de contexto do arquivo no Explorer, pelo clique direito no código ou na aba do arquivo, ou pelo botão no título do editor.
Edite o JSON no painel esquerdo. O grafo à direita acompanha as alterações após 250 ms sem digitação, incluindo alterações ainda não salvas.
Clique em uma propriedade, valor ou título de cartão para selecionar seu trecho no código.
Cada painel acompanha seu próprio arquivo. Executar o comando novamente para o mesmo documento reutiliza o painel. A extensão não muda o editor padrão de JSON.
Controles
Arraste o fundo para mover o grafo; use a roda do mouse ou os botões + e − para ajustar o zoom.
Use Ajustar à tela para enquadrar os cartões visíveis.
Recolha ou expanda um ramo pela seta no cartão. A barra superior também permite recolher ou expandir todos os ramos.
Busque propriedades e valores com Ctrl+F (Cmd+F no macOS). Enter avança, Shift+Enter volta e Esc limpa a busca. A busca não diferencia maiúsculas e minúsculas e também encontra ramos recolhidos.
Use Tab e Enter para navegar e acionar os botões. Propriedades extensas têm paginação de 12 linhas por cartão; a busca abre a página correspondente automaticamente.
Quando o JSON fica inválido, a extensão informa linha e coluna e mantém o último grafo válido, identificado como desatualizado. A navegação ao código fica pausada até a correção.
Formatar JSON
Na visualização, escolha 2 espaços, 3 espaços ou 4 espaços e clique em Formatar JSON. A indentação inicial é de 4 espaços; a última escolha fica salva nas configurações do usuário em magicJson.indentSpaces e acompanha os demais painéis abertos.
Exportar JPEG
Clique em Exportar JPEG e escolha o destino no diálogo de salvamento. O nome sugerido é <arquivo>-magic-json.jpg.
