web頁面上視覺化展示JSON資料的方法

2021-08-17 05:46:43 字數 579 閱讀 3563

0 引言

最近需要做乙個介面管理的功能,需要在前端頁面展示從介面獲取到的json資料,我上網查了一些資料,發現有 jquery的乙個外掛程式可以使用:

jquery.json-viewer

1實現方法

方法其實很簡單,直接上**: 

html**如下:

<

pre><

codeid=

"json"

>

code

>

pre>

js**如下:

letbtn

=document

.queryselector(

'#json'

); let

data=;

btn.textcontent

=json

.stringify(

data

, null

, ' ');

效果如下: 

{

name:"time",

age:23,

grade:3

是不是很簡單呢。

json視覺化樹

近期專案需要整合第三方webservice服務,前端介面需要將第三方請求json,返回json的視覺化展示。借用第三方外掛程式展示 vue json viewer 利用reflect遞迴查詢賦值 請求資料 pwd body myproperty 響應資料 body myproperty 借用第三方外...

視覺化展示 Django 初試

開啟命令列 cmd cd 到乙個你想放置你 的目錄,然後執行以下命令 django admin startproject helloword專案目錄 helloword manage.py helloword init py settings.py urls.py wsgi.py 進入外層hello...

visio 資料視覺化 資料展示

本章講解如何將形狀資料展示成資料影象,也就是將新增的屬性,展示在圖形上 1 資料圖形控制面板 選中圖形 右鍵 資料 編輯資料圖形 2 新建資料圖形 資料字段 也就是圖形的屬性 顯示為 資料的顯示形式,visio為提供了四個屬性的顯示形式 文字 乙個格式化的文字框,有時伴隨著乙個圖示用於顯示文字。資料...