聊聊OrgChart 使用，優雅的方式為你展現舒服的組織架構圖，

前言

閑來無事寫一個多級用戶關系層，于是就存在展示的問題。這時OrgChart就派上了用場。

在用的過程中，有一耐耐的小問題，咔咔就借著問題點，給大家介紹這款插件的使用。

最終效果如下

當然咔咔最終需要實現的效果肯定不是這個樣子了，這個只是這個插件可以實現出來的效果。看了這個圖你就知道適不適合自己的項目了。

一、接入OrgChart

下載地址咔咔提供不了，會提示廣告的，如果找不到評論區見。

這是下載后的文件，文件夾中除了css、js、font其它的文件夾都是不同類型的組織架構圖。

這里咔咔使用的是第一種ajax-datasource

將需需要的文件放到資源目錄下即可

在ajax-datasource文件夾下有個index.html，里邊附帶的有案例

這個時候我們就需要將這份代碼復制到項目中需要展示的頁面中，也就是簡單的配置css、js的加載路徑而已。

嗯吶！就這樣，很是簡單吧！著實很簡單。

來看看效果唄！

這時有沒有疑問，這些數據是哪里來的，那就一起找找唄！

數據原來在這里，那咱們就需要把這段js代碼復制到自己需要展示的地方了。但是數據肯定不是固定的，是后臺傳過來的。嗯，對，沒錯

這個時候先別著急，下看看它的數據結構，里邊有name、title。

那么試想一下， 我們把這幾個值修改一下，還會正常顯示嗎？

果不其然，涼透透了，為什么要修改這個鍵值呢！因為你的數據庫字段不可能跟這個是完全符合的啊！

這個時候就需要看文檔了，咔咔這里直接給出解決方法。

只需要在加一行代碼即可，其余的參數還是需要大家去查看文檔解決哈！

好了，這個時候一切工作準備就緒，只需要從后臺傳入數據就ok了，終于就剩最后一步了。

咔咔把數據保存到了input中，然后獲取出來，終于完成了。

來吧！展示！納尼！怎么是這個樣子，有一個值怎么是空的。

這個時候二話沒說，打開后臺打印一下數據看看什么情況。數據一切安好。

二、分析問題

針對上面出現的問題，不得不在回到演示案例中。

其實在這個數據結構中，可以清楚的看明白，那就是鍵值都是帶引號的。

不信的話來測試一下，自定義一份數據，然后檢測一下。

經過驗證這樣的數據是可以的，那么在來試一下業務中的真實數據。

經過一番驗證，相信伙伴們都已經了解這個問題了

三、解決問題

先看一下數據庫給的數據類型為int，這里為什么使用int就不提了哈！項目需要，嗯吶！不多做解釋了

此時就需要進行類型的轉換了，打開TP框架的文檔，瞅一眼

經過查詢，目前TP框架只支持這幾種類型的轉換。

既然這條路通不了，那么就尋找其它的路，條條大路通Bug對吧！

在MySQL中有倆個函數可以處理類型轉換， CAST、 CONVERT這倆個函數都可以。

但咔咔今天給大家說一種新的方式，這種方式大家都見過，那就是PHP中函數rtrim。

你是不是會說，不是吧！這都可以，rtirm都知道是處理右側空白字符串或者預定義字符的

但是來看一下技術細節，返回的是修改的字符串，真好！

整起，修改查詢方式。

來吧！看一下效果，這就很是nice

四、總結

學習并使用OrgChart

了解TP框架的類型轉換

學習并使用MySQL的類型轉換

對rtirm函數學習

堅持學習、堅持寫博、堅持分享是咔咔從業以來一直所秉持的信念。希望在偌大互聯網中咔咔的文章能帶給你一絲絲幫助。我是咔咔，下期見。

總結

以上是生活随笔為你收集整理的orgchart php,最需要的时候遇见你OrgChart的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。