38 điểm bởi imjuni 2025-10-13 | 26 bình luận | Chia sẻ qua WhatsApp

Đây là một công cụ trực quan hóa JSON. Có khá nhiều công cụ trực quan hóa JSON tốt, và cũng đã từng được giới thiệu vài lần trên GeekNews. Tôi cũng đã sử dụng những công cụ đó rất hữu ích.

Tuy nhiên, như thường lệ, tôi vẫn thấy một vài điểm chưa thật sự ưng ý nên đã quyết định tự làm một cái. Các tính năng cơ bản như sau.

  • Trực quan hóa dữ liệu JSON dưới dạng đồ thị
  • Khi chỉnh sửa bằng trình soạn thảo, phần trực quan hóa sẽ được cập nhật tương ứng
  • Tính năng tìm kiếm node
  • Phân biệt màu sắc theo từng kiểu dữ liệu

Những điểm khiến tôi cảm thấy bất tiện là như sau.

  • Tôi muốn chia sẻ đúng màn hình mà mình đang xem
  • Sẽ tốt hơn nếu hỗ trợ YML
  • Sẽ tốt hơn nếu hiển thị tốt trên thiết bị di động

Đây là những điểm khác biệt. Tôi định sẽ dần bổ sung thêm tính năng khi có nhu cầu. Nếu bạn có phản hồi hoặc muốn đóng góp thì rất hoan nghênh.

Xin cảm ơn.

26 bình luận

 
selene 2025-12-03

Sẽ tốt hơn nếu có thể làm nổi bật hoặc lọc chỉ những node muốn tìm bằng JSONPath.
Tôi cũng xin góp ý rằng nếu có thêm tính năng kéo để di chuyển trong minimap thì có lẽ sẽ rất hữu ích.. haha, với JSON lớn thì không dễ để tìm được node mong muốn đâu T_T

 
roxie 2025-10-14

Kích thước lớn quá nên có vẻ render khá vất vả nhỉ haha T_T Tôi dùng khoảng 500 nghìn byte.

 
imjuni 2025-10-15

Có vẻ vì xyflow dựa trên DOM nên khi số lượng node tăng lên thì hiệu năng sẽ hơi giảm. Cải thiện hiệu năng cũng là một trong những mục tiêu mà tôi muốn thử. Cảm ơn bạn.

 
roxie 2025-10-15

Có vẻ như việc để mặc định hiển thị ở trạng thái đều được thu gọn cũng sẽ là một giải pháp. Dù sao thì phần tôi muốn xem cũng chỉ là một phần rất nhỏ thôi.

 
onixboox 2025-10-14

Ồ, gọn gàng thật. Tôi sẽ thỉnh thoảng dùng thử.

 
imjuni 2025-10-14

Cảm ơn phản hồi của bạn.

 
eususu 2025-10-14

Rất gọn gàng và đẹp mắt.
Tuy nhiên khi chuyển sang giao diện tối, chỉ có cửa sổ mã là không được áp dụng.

 
imjuni 2025-10-14

Khung mã đang được quản lý bằng một theme riêng. Bạn có thể dùng phần cài đặt bên cạnh Export để đổi theme. Ban đầu tôi định liên kết nó, nhưng để giữ nhiều lựa chọn hơn nên đã làm riêng.

 
rboo1 2025-10-14

Đúng là mình đang cần thứ như thế này nên thấy rất tuyệt.

Sẽ rất hay nếu có tính năng gộp và hiển thị các danh sách dài!

 
imjuni 2025-10-14

Cảm ơn bạn. Tính năng gộp như show/less hiện được loại khỏi phiên bản hiện tại vì có vấn đề khi render các node con. Chúng tôi sẽ tiếp tục suy nghĩ thêm xem có cách nào tốt hơn không.

 
natenewbie 2025-10-14

Hay đấy!

 
imjuni 2025-10-14

Cảm ơn bạn.

 
yeorinhieut 2025-10-13

Không biết có phải do Safari không, nhưng trên iPad thì nó không hiển thị đúng.

 
imjuni 2025-10-14

Trên iPhone của tôi thì hiển thị ổn nên tôi cũng yên tâm, nhưng dòng iPad thì lại khác nữa nhỉ. Khi nào có thời gian tôi sẽ kiểm tra thử. Cảm ơn.

 
shakespeares 2025-10-13

Có vẻ khá ổn!

 
imjuni 2025-10-13

Cảm ơn phản hồi của bạn 👍

 
kakasoo 2025-10-13

Cái này hay quá. Tôi đã đăng nhập chỉ để bình luận thôi. hahaha

 
imjuni 2025-10-13

Cảm ơn phản hồi của bạn 👍

 
t7vonn 2025-10-13

Ồ, khá ổn đấy

 
imjuni 2025-10-13

Cảm ơn bạn đã phản hồi 👍

 
hybridego 2025-10-13

Mình nghĩ sẽ tốt hơn nếu khi thay đổi ở phần trực quan hóa thì nó cũng được áp dụng vào trình soạn thảo.

 
imjuni 2025-10-13

Đó là một ý tưởng hay. Tôi sẽ cân nhắc cách áp dụng nó.

 
cadenzah 2025-10-13

Sẽ rất tuyệt nếu có thể mở nhiều tệp JSON bằng tab hoặc tương tự để chuyển qua lại và làm việc với chúng.

 
imjuni 2025-10-13

Tôi đã định hỗ trợ tab, nhưng có vẻ việc export/import sẽ trở nên phức tạp nên đã tạm loại khỏi bản phát hành đầu tiên. Tôi sẽ sớm bổ sung.

 
m00nlygreat 2025-10-13

Hay đấy, nhưng sẽ tốt hơn nếu cái này hỗ trợ tiện ích mở rộng Chrome + đọc hệ thống tệp.

Nhưng mà cá nhân mình thấy JSON thì cứ xem bằng editor vẫn là tốt nhất ^_T

 
imjuni 2025-10-13

Bạn có thể tải tệp lên bằng cách dùng import. Tôi sẽ cân nhắc về tiện ích mở rộng Chrome. Cảm ơn!