Beautiful JSON Rendering In Pure JavaScript – JSON Formatter

Category: Javascript , Text | September 20, 2018
Author: mohsen1
Views Total: 4,408
Official Page: Go to website
Last Update: September 20, 2018
License: MIT

Preview:

Beautiful JSON Rendering In Pure JavaScript – JSON Formatter

Description:

JSON Formatter is a pure JavaScript plugin used for rending local JSON objects and/or external JSON files in an elegant way (just like the collapsible tree structure).

How to use it:

Install the JSON Formatter via NPM.

npm install --save json-formatter-js

Or directly include the JavaScript in your html document.

<script src="dist/json-formatter.js"></script>

Create a new JSONFormatter object with the following parameters:

  • json: json object or array
  • open: indicates how many levels the rendered tree should expand
  • config: configuration options
JSONFormatter(json, open, config)

All default configuration options.

{
  hoverPreviewEnabled: false,
  hoverPreviewArrayCount: 100,
  hoverPreviewFieldCount: 5,
  animateOpen: true,
  animateClose: true,
  theme: null, // or 'dark'
  useToJSON: true // use the toJSON method to render an object as a string as available
};

Open a specific depth.

const formatter = new Formatter();
formatter.openAtDepth(1);

Changelog:

v2.2.1 (09/20/2018)

  • Bugfix & add more options

You Might Be Interested In:

One thought on “Beautiful JSON Rendering In Pure JavaScript – JSON Formatter

Leave a Reply