How to visualize mongodb documents in a json tree view
- Step 1Export the document as JSON — From the shell:
mongoexport --db app --collection users --query '{"_id": ObjectId("...")}' --out doc.json, or in MongoDB Compass right-click a document and Copy Document, paste into a.jsonfile. Either gives you Extended JSON the viewer can read as strict JSON. - Step 2Drop the file onto the viewer — Accepted extensions:
.json,.ndjson,.jsonl,.txt. For a single document use a.jsonfile with one JSON object. The free tier handles files up to 2 MB, which covers the vast majority of single documents. - Step 3Set Max depth for deeply embedded docs — Leave Max depth at 20 (default) for most documents. If a document embeds arrays of subdocuments many levels deep and you only want the top shape, lower it — deep subdocuments still show as
Object(n)/Array(n)nodes without expandable children. - Step 4Click View Tree and read the document shape — Start at
$and confirm the top fields (_id,createdAt,profile,orders). Note how_idappears as{"$oid": "..."}and dates as{"$date": "..."}— that's Extended JSON. The toolbar shows total nodes and max depth. - Step 5Search to find a field across nested subdocuments — Type a key (
email,legacyId) or a value (an ObjectId hex, an email). Matching branches expand and the rest hide, so you immediately see where in the nested structure the field lives. - Step 6Copy the dotted path for projections and updates — Hover the field and Copy to grab
$.profile.preferences.notifications.email. Strip the leading$.and you have the MongoDB dot-path for a projection ({ 'profile.preferences.notifications.email': 1 }) or a$set. Download exports the tree shape as<name>.tree.json.
How MongoDB Extended JSON types appear in the tree
mongoexport and Compass emit Extended JSON, where BSON types are wrapped in objects. The viewer parses strict JSON, so it shows these wrappers literally — it does not collapse them to a native value.
| BSON type in MongoDB | Extended JSON written out | What the tree shows | Notes |
|---|---|---|---|
| ObjectId | { "$oid": "6650a1..." } | Object(1) → $oid string node | Expand to read/copy the hex id; the wrapper is preserved |
| Date | { "$date": "2026-05-01T..." } | Object(1) → $date string node | ISO string under $date; not parsed into a Date object |
| Int32 / Double | 42 / 42.5 | number node | Plain JSON numbers — subject to double precision |
| Int64 (NumberLong) | { "$numberLong": "123" } | Object(1) → $numberLong string node | Stored as string to preserve 64-bit precision |
| Decimal128 | { "$numberDecimal": "9.99" } | Object(1) → string node | Kept as string; no precision loss in display |
| Boolean / null | true / null | boolean / null node | Native — distinguishes null from a missing field |
From copied tree path to MongoDB query path
The viewer's $/dot path maps directly to MongoDB's dot-notation once you drop the leading $..
| Field in the document | Viewer copies | MongoDB dot-path | Use in |
|---|---|---|---|
email in profile | $.profile.email | profile.email | projection / $set |
| First address | $.addresses[0] | addresses.0 | positional update |
| City of first address | $.addresses[0].city | addresses.0.city | nested filter |
| A tag in an array | $.tags[2] | tags.2 | array element query |
| Nested flag | $.settings.flags.beta | settings.flags.beta | $set / projection |
Cookbook
MongoDB document-exploration walkthroughs. ObjectIds and PII anonymised; shapes mirror real mongoexport/Compass output.
See the shape of an inherited collection
ExampleYou exported one representative document to learn the schema. The tree shows top-level fields and embedded structure at a glance.
doc.json (from mongoexport):
$ .................... Object(6)
$._id ............... Object(1) → { "$oid": "6650a1..." }
$.email ............. "ada@example.com"
$.createdAt ......... Object(1) → { "$date": "2026-05-01T.." }
$.profile ........... Object(4)
$.orders ............ Array(2)
$.tags .............. Array(3)
You now know the document carries _id, email, createdAt,
a profile object, an orders array, and tags.Copy a nested dot-path for a projection
ExampleYou want to project just the email-notification preference. Copy the path, drop the $., and you have the MongoDB projection key.
Tree:
$.profile.preferences.notifications.email ... true
Copy → $.profile.preferences.notifications.email
MongoDB projection:
db.users.find({}, {
"profile.preferences.notifications.email": 1
})Read an ObjectId reference
ExampleA document references another via an ObjectId. The tree shows the Extended-JSON wrapper; expand it to read and copy the hex value.
$.orgId ............. Object(1)
$.orgId.$oid ........ "664f0c9a2b..."
The reference is stored as { "$oid": "..." }. Expand orgId
to copy the hex, then look it up in the orgs collection.
The viewer shows the wrapper as-is — it does not resolve
the reference.Spot schema drift across an array of subdocuments
ExampleAn embedded orders array should have uniform shape, but some elements are missing a field. The tree's child counts flag the inconsistency.
$.orders ............ Array(2) $.orders[0] ......... Object(4) → id, total, status, paidAt $.orders[1] ......... Object(3) → id, total, status (no paidAt) orders[1] has 3 keys vs orders[0]'s 4 — paidAt is missing on the second order. Classic NoSQL schema drift.
Distinguish null from a missing field
ExampleYour app crashes on user.deletedAt. The tree shows whether the field is present-and-null or absent entirely.
$.deletedAt ......... null ← present, explicitly null vs a document where no deletedAt node appears at all (field omitted). Code must handle both null and missing — the tree makes which case you're in unambiguous.
Errors and edge cases
Real errors and silent failures sourced from each platform's own documentation. Match the wording to the row, fix what the row says to fix.
ObjectId/ISODate shown as $oid / $date wrappers
By designmongoexport and Compass write Extended JSON: ObjectIds become {"$oid": "..."} and dates become {"$date": "..."}. The viewer parses strict JSON, so it shows these wrappers literally rather than collapsing them to a native id or Date. Expand the wrapper to read or copy the value — this is expected, not an error.
Shell-syntax document with ObjectId(...) / ISODate(...)
Parse errorCopying from the legacy mongo shell can produce ObjectId("...") and ISODate("...") function calls — that's JavaScript, not JSON, so JSON.parse throws. Use mongoexport or Compass's Copy Document (which emit Extended JSON) instead, or convert the shell syntax to strict JSON before viewing.
Multiple documents, one per line (mongoexport default)
Single document onlymongoexport without --jsonArray writes one JSON document per line (NDJSON). The viewer parses the whole file as ONE JSON value, so a multi-line export fails. Re-run with mongoexport --jsonArray to get a single [ ... ] array, then view that.
NumberLong / Decimal128 stored as strings
Preserved64-bit and decimal types are written as {"$numberLong": "..."} / {"$numberDecimal": "..."} with the value as a string to avoid precision loss. The tree preserves them exactly — no rounding. Plain JSON numbers, by contrast, are doubles and can lose precision past 2^53.
Document deeper than Max depth
PreservedDeeply embedded subdocuments past the Max depth cap appear as Object(n) / Array(n) with their child count but can't be expanded. Raise Max depth (up to 20) and re-run to drill deeper. No fields are dropped — only child rendering is capped.
Trailing comma or comment in a hand-edited export
Parse errorStrict JSON allows neither trailing commas nor comments. If you edited the export by hand, clean it up first — json-format-fixer handles both — then view the result.
Duplicate keys in a subdocument
Last winsIf an exported object repeats a key, JSON.parse keeps the last occurrence and the tree shows one node. MongoDB documents shouldn't have duplicate keys, so this usually indicates a hand-edit error — check the raw text.
Binary / GridFS data in the document
Shown as wrapperBSON binary appears in Extended JSON as {"$binary": {"base64": "...", "subType": "..."}}. The tree shows the wrapper and the base64 string node; it does not decode the binary. Large base64 blobs also count toward the file-size limit.
File over the 2 MB free limit
Upgrade requiredFree uploads cap at 2 MB. A single document with embedded binary or large arrays can exceed it. Pro raises the limit to 100 MB; for big multi-document exports, see the large-JSON workflow.
You wanted the viewer to resolve references
Not supportedThe viewer shows an $oid reference as the stored value; it does not follow it to the referenced document — there's no database connection. Copy the hex and query the referenced collection yourself, or denormalise before exporting.
Frequently asked questions
Why does _id show as { "$oid": ... } instead of an ObjectId?
That's MongoDB Extended JSON. mongoexport and Compass wrap BSON types so they round-trip through JSON — ObjectId becomes {"$oid": "..."}, Date becomes {"$date": "..."}. The viewer parses strict JSON, so it shows the wrapper. Expand it to read or copy the value.
My export won't parse. What happened?
Most likely it's shell syntax (ObjectId("..."), ISODate("...")) which is JavaScript, not JSON, or it's a multi-line NDJSON export. Use mongoexport --jsonArray for a single JSON array, or Compass's Copy Document for valid Extended JSON.
How do I turn a copied path into a MongoDB query?
The viewer copies $.profile.email. Drop the leading $. to get MongoDB dot-notation profile.email for a projection or $set. Array indices map [0] → .0 (e.g. addresses.0.city).
Can it visualise a whole collection at once?
It parses one JSON document (or one JSON array) at a time, within the size limit. Export an array with mongoexport --jsonArray to view multiple documents together, staying under 2 MB on free / 100 MB on Pro.
Does it decode binary or GridFS fields?
No. BSON binary appears as the Extended-JSON {"$binary": ...} wrapper with the base64 string; the viewer shows it but doesn't decode it.
Will big numeric IDs lose precision?
Plain JSON numbers are doubles and round past 2^53. MongoDB avoids this for 64-bit/decimal types by writing them as strings under $numberLong / $numberDecimal, which the tree preserves exactly.
How do I find schema drift across embedded subdocuments?
Compare the child counts the tree shows on each array element — orders[0] as Object(4) vs orders[1] as Object(3) flags a missing field. Expand both to see which key differs.
Does it follow ObjectId references to other documents?
No — there's no database connection. It shows the $oid value; copy it and query the referenced collection yourself.
Is my document data uploaded?
No. Parsing runs in your browser with native JSON.parse. PII and IDs in the document never leave your machine. To share a sanitised copy, run it through json-anonymizer first.
Can it validate the document or infer a schema?
It only visualises. Use json-validator to validate, or json-schema-generator to derive a JSON Schema from a sample document.
How do I get a flat table of fields from the document?
Use json-flattener to flatten the document into dotted-key rows, or json-to-csv for a CSV. The tree viewer is for interactive exploration.
Is it free for MongoDB documents?
Yes — it runs in your browser and works on the free tier up to 2 MB per file, enough for nearly any single document. Pro removes the size limit (100 MB) and adds bulk and saved history.
Privacy first
Conversion runs locally in your browser. No file is uploaded — only metadata counters are saved for signed-in dashboard stats.