json視覺化樹

2021-10-09 10:48:57 字數 2070 閱讀 2265

近期專案需要整合第三方webservice服務,前端介面需要將第三方請求json,返回json的視覺化展示。

借用第三方外掛程式展示 vue-json-viewer

利用reflect遞迴查詢賦值

請求資料

,"pwd":}}}},"body":,"myproperty":}}}}}}}
響應資料

},"body":,"myproperty":}}}}}}}
借用第三方外掛程式展示 vue-json-viewer

"json格式化"

:operationtype=

"operationtype"

:maskclosable=

"false"

:destroyonclose=

"true"

:visible=

"visible" width=

"900px" centered

@ok=

"handleok" @cancel=

"handlecancel"

>

"confirmloading"

>

/h3>

"requestjsondata"

:expand-depth=

5 copyable boxed sort>

<

/json-viewer>

/h3>

"responsejsondata"

:expand-depth=

5 copyable boxed sort>

<

/json-viewer>

<

/div>

<

/a-spin>

<

/s-modal>

<

/template>

import vue from

'vue'

import

from

'@/components'

import jsonviewer from

'vue-json-viewer'

vue.

use(jsonviewer)

export

default

,data()

, responsejsondata:,}

},methods:

,handleok()

,handlecancel()

,},}

<

/script>利用reflect遞迴查詢賦值

//json序列化

initinputdatafromjsonschema

(jsonschema)

,jsonschematodata

(jsonschema)

this

.setdatafromjsonschema

(jsonobj, root)

return root

},setdatafromjsonschema

(jsonobj, parent))}

else

if(nodetype ==

'array'

&& reflect.

has(jsonobj,

'items'))

else

if(nodetype ==

'number'

)else},

initchilditem

(obj, name)

return child

},reflectstrin**alue

(obj, property)

,兩種方式視覺化json資料

vue-json-viewer和reflect的使用

決策樹視覺化

決策樹相比其他演算法的乙個重要特性就是 可解釋性,構建決策樹的過程就相當於形成 if then 規則集。如果我們能夠將生成的決策樹視覺化,那麼我們就可以對資料集與 值之間的關係有清晰的認識。首先,我們以 sklearn.datasets 包中的鳶尾花資料集為例。from sklearn.datase...

資料視覺化 什麼是資料視覺化

資料對應的英文單詞是data,從資訊獲取的角度看,資料是對目標觀察和記錄的結果,是現實世界中的時間 地點 事件 其他物件或概念的描述。不同學者對資料的作用也給出不同的定義,大致分為以下3類 視覺化對應的兩個英文單詞 visualize和visualization。visualize是動詞,描述 生成...

sklearn 決策樹視覺化

來自google developer 的machine learning recipes with josh gordon youtube鏈結 這裡使用了lris flower data set 生成了乙個認花的小樹 import numpy as np from sklearn.datasets ...