d3常用API及使用心得

2021-08-20 09:47:59 字數 2243 閱讀 8689

1、記得用svg標籤包裹元素,否則檢視元素屬性都正確,顯示卻是一片空白。

2、應該使用第一種寫法,第二種寫法會導致不居中顯示,整個圖在左上角。

let svg = d3.select("#basic-topo");

let clientrect = svg.node().getboundingclientrect(),

width = +clientrect.width,

height = +clientrect.height;

let svg = d3.select("#basic-topo"),  

width = +svg.attr("width"), // 第二種寫法

height = +svg.attr("height");

第三種寫法,用類來封裝

let topologygraphlayout = function(vm, selector)

在css的命名規範中,名稱不能以數字開始,只能以字母、連字元、下劃線開始。之後可以是字母、連字元、下劃線或數字。
4、將物件轉為陣列的方法

d3.values - 列舉關聯陣列的值。

d3.entries - 列舉關聯陣列的鍵值對實體。

5、對映

map.has - 返回map中是否包含某個值。

map.get - 獲取值。

map.set - 設定值。

map.remove - 移除值。

map.clear - 移除所有值。

map.keys - 獲取鍵陣列。

map.values - 獲取值陣列。

map.entries - 獲取鍵值對陣列。

map.each - 為每個元素呼叫一次指定的方法。

map.empty - 返回map是否為空。

map.size - 計算值的數量。

6、集合

set.has - 返回set中是否包含某個值。

set.add - 新增指定值。

set.remove - 刪除指定值。

set.clear - 移除所有值。

set.values - 獲取值陣列。

set.each - 為每個元素呼叫一次指定的方法。

set.empty - 返回set是否為空。

set.size - 計算值的數量。

7、選擇元素

d3選擇,插入, 刪除元素

d3.select - 從文件中選擇乙個元素。

d3.selectall - 從文件中選擇多個元素。

selection.select - 選擇每個選中元素的乙個後代元素。

selection.selectall - 選擇每個選中元素的多個後代元素。

selection.filter - 基於資料過濾元素。

selection.merge - 合併兩個選擇。

d3.matcher - 測試乙個元素是否匹配選擇器。

d3.selector - 選擇乙個元素。

d3.selectorall - 選擇多個元素。

d3.window - 得到節點的所有者視窗。

8、修改元素

selection.classed - 獲取,新增或移除css類。

selection.style - 設定或獲採樣式。

selection.property - 設定或獲取行內屬性。

selection.text - 設定或獲取文字內容。

selection.html - 設定或獲取inner html。

selection.remove - 移除文件中的元素。

selection.sort - 基於資料給文件中的元素排序。

selection.order - 重排列文件中的元素以匹配選擇中的順序。

selection.raise - 重新排列每個元素為父元素的最後乙個子節點。

selection.lower - 重新排列每個元素為父元素的第乙個子節點。

d3.creator - 通過名稱建立元素。

9、資料繫結

理解update,enter,exit的使用

selection.enter - 獲得進入(enter)選擇器(資料無元素)。

selection.exit - 獲得退出(exit)選擇器(元素無資料)。

selection.datum - 獲取或設定元素的資料(不繫結)。

D80使用心得3

d80使用技巧,參照此方法練去吧。風景照 a檔,低iso,自動白平衡,延遲模式 快門慢 小光圈,鮮豔模式,自動對焦。微 距 a檔,iso100 400,自動白平衡,小光圈,手動對焦。夜景照 a檔,低iso 100 自動白平衡或白熾燈,小光圈f11 f16,標準色彩模式,開啟長時間暴光減少干擾。人像照...

PowerDesigner 使用心得3

1 如何在powerdesigner下建索引 1 雙擊表設計圖,出來table properties,在tab 頁中選擇 indexes 2 單擊新建索引的屬性,出現indexex properties 3 增加乙個索引包含的字段 2 如何在powerdesigner 下建自增列 2 使用sqlse...

D80使用心得4

運動照和動感照 1 d80的對焦能力還不足以應付體育攝影的對焦要求,所以通常都是採用所謂的 陷阱對焦 方法 預對焦 來拍攝。具體就是先以乙個固定物體 運動員會經過的地方 作為對焦點,對焦準確後轉換為手動對焦 其實就是想鎖定對焦點 半按快門等待運動員經過該處,然後按動快門。2 d80在iso 800時...