D3: d3 tree

jeyhan 發(fā)布于2019-08-19 14:35 / 1588人閱讀

摘要：定位節(jié)點(diǎn)樹(shù)的別名計(jì)算樹(shù)布局并返回節(jié)點(diǎn)數(shù)組計(jì)算樹(shù)節(jié)點(diǎn)之間的父子關(guān)系獲取或設(shè)置子節(jié)點(diǎn)訪(fǎng)問(wèn)函數(shù)對(duì)同級(jí)節(jié)點(diǎn)進(jìn)行排序獲取或設(shè)置相鄰節(jié)點(diǎn)之間的間距的函數(shù)指定在和的布局尺寸指定每個(gè)節(jié)點(diǎn)的固定大小創(chuàng)建一個(gè)新的對(duì)角發(fā)生器獲取或設(shè)置一個(gè)

d3.layout.tree API

d3.layout.tree - position a tree of nodes tidil 定位節(jié)點(diǎn)樹(shù)
tree - alias for tree.nodes tree.nodes 的別名
tree.nodes - compute the tree layout and return the array of nodes 計(jì)算樹(shù)布局并返回節(jié)點(diǎn)數(shù)組
tree.links - compute the parent-child links between tree nodes 計(jì)算樹(shù)節(jié)點(diǎn)之間的父子關(guān)系
tree.children -get or set the children accessor function 獲取或設(shè)置子節(jié)點(diǎn)訪(fǎng)問(wèn)函數(shù)
tree.sort - control the order in which sibling nodes are traversed 對(duì)同級(jí)節(jié)點(diǎn)進(jìn)行排序
tree.separation - get or set the spacing function between neighboring nodes 獲取或設(shè)置相鄰節(jié)點(diǎn)之間的間距的函數(shù)
tree.size - specify the layout size in x and y 指定在x和y的布局尺寸
tree.nodeSize - specify a fixed size for each node 指定每個(gè)節(jié)點(diǎn)的固定大小

d3.svg.diagonal API

d3.svg.diagonal - create a new diagonal generator 創(chuàng)建一個(gè)新的對(duì)角發(fā)生器
diagonal.projection - get or set an optional point transform 獲取或設(shè)置一個(gè)任意變換點(diǎn)

d3 tree 實(shí)例

d3 tree - d3 tree - A simple Tree Diagram

d3 tree - Styling nodes in a tree diagram

d3 tree - Making a vertical tree diagram

d3 tree - Generating a tree diagram from ‘flat’ data

d3 tree - An interactive tree diagram

d3 tree - An interactive tree diagram with arrow marker

GPU云服務(wù)器云服務(wù)器 d3 python d3 d3.js d3導(dǎo)出功能

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/78032.html

相關(guān)文章

D3力導(dǎo)向圖及樹(shù)狀布局變換

摘要：繪制力導(dǎo)向圖新建畫(huà)布創(chuàng)建，的繪制中為了避免混亂及后續(xù)事件的添加，建議使用標(biāo)簽將畫(huà)布分組。用拷貝數(shù)組，避免影響全局?jǐn)?shù)據(jù)。將數(shù)據(jù)整理為樹(shù)狀結(jié)構(gòu)使用樹(shù)狀布局計(jì)算位置重啟布局以改變位置在運(yùn)動(dòng)前強(qiáng)制修改節(jié)點(diǎn)坐標(biāo)為樹(shù)狀結(jié)構(gòu) D3力導(dǎo)向圖及樹(shù)狀布局變換 d3的力導(dǎo)向圖是表現(xiàn)關(guān)系型數(shù)據(jù)比較方便且直觀的方法，但是會(huì)遇到節(jié)點(diǎn)比較多且層級(jí)關(guān)系混亂的情況，這時(shí)樹(shù)狀布局就比較方便了，如何不破壞原來(lái)結(jié)構(gòu)以最小的代...

canopus4u 2019-08-21 16:48 評(píng)論0 收藏0
d3-force 力導(dǎo)圖源碼解讀與原理分析【二：四叉樹(shù)（一）】

摘要：我們?cè)谏衔脑创a解析發(fā)現(xiàn)版的節(jié)點(diǎn)碰撞采用四叉樹(shù)進(jìn)行了優(yōu)化。那么版本的力導(dǎo)圖具體和版的有何不同點(diǎn)呢，四叉樹(shù)又如何優(yōu)化碰撞校驗(yàn)的呢原文鏈接被重命名為。性能的提高歸功于的新的四叉樹(shù)。我們?cè)谏衔脑创a解析發(fā)現(xiàn)v4版的節(jié)點(diǎn)碰撞采用四叉樹(shù)進(jìn)行了優(yōu)化。那么V4版本的力導(dǎo)圖具體和v3版的有何不同點(diǎn)呢，四叉樹(shù)又如何優(yōu)化碰撞校驗(yàn)的呢？ v3-force VS v4-force https://github...

pepperwang 2019-08-20 15:32 評(píng)論0 收藏0
D3.js可視化前端框架的使用要點(diǎn)

摘要：該事件不會(huì)區(qū)分字母的大小寫(xiě)，例如和被視為一致。這些布局的作用都是將某種數(shù)據(jù)轉(zhuǎn)換成另一種數(shù)據(jù)，而轉(zhuǎn)換后的數(shù)據(jù)是利于可視化的。而有元素與數(shù)據(jù)對(duì)應(yīng)的部分稱(chēng)為。 1.安裝

MASAILA 2019-08-22 14:57 評(píng)論0 收藏0
d3-force 力導(dǎo)圖源碼解讀與原理分析【一】

摘要：設(shè)置力導(dǎo)圖點(diǎn)陣中心碰撞其他引用模塊構(gòu)造常量函數(shù)微小晃動(dòng)隨機(jī)數(shù)四叉樹(shù)模塊設(shè)置力導(dǎo)圖點(diǎn)陣中心此處代碼使用的是單例對(duì)象模式，讀者要注意，切勿與類(lèi)對(duì)象理解混了。首先先推薦一下某呆翻譯的d3-force的中文文檔：https://github.com/xswei/D3-V... 。在我們解讀源碼前還請(qǐng)讀者先熟悉一下force相關(guān)的API,以及es6語(yǔ)法 . 如有分析不當(dāng)之處還請(qǐng)留言指出，謝謝...

luckyyulin 2019-08-20 14:48 評(píng)論0 收藏0
前端綜合性文檔和教程總結(jié)（持續(xù)更新）

摘要：小弟在前端摸爬滾打一段時(shí)間，發(fā)現(xiàn)前端的比較好的文檔比較分散，特別是中文的，我平時(shí)都是收藏在瀏覽器里，以后有好的教程和綜合性的文檔我會(huì)更新到這里。小組中文文檔，很全。小弟在前端摸爬滾打一段時(shí)間，發(fā)現(xiàn)前端的比較好的文檔比較分散，特別是中文的，我平時(shí)都是ctrl+D收藏在瀏覽器里，以后有好的教程和綜合性的文檔我會(huì)更新到這里。一則可以做個(gè)記錄，防止丟失。二則有需要的朋友可以來(lái)我這里找一找。 ...

piglei 2019-08-20 10:19 評(píng)論0 收藏0