D3上沒有創建DIV的輸入（）數據與多個值

請注意，這不是一個問題如何得到一個酒吧。幸運的是，我已經覆蓋了它。它更多的是爲什麼不是問題。當現實不符合預期時，通常需要吸取教訓。此外，基於非常有用的評論，我意識到診斷是不正確的，所以我更新了這個問題。D3上沒有創建DIV的輸入（）數據與多個值

我剛開始嘗試D3。通過例子，我得到了一些很好的圖表。然後，我測試了這一點（只是爲了在純粹的學術目的上用不太常見的方法積累知識）。

var graphs = d3.select("#graph").selectAll("div"); 
graphs.data([1, 2, 3, 4]).enter() 
    .append("div").text(function(d){ return d; });

DIV的數量沒有變化。這使我感到困惑，因爲我期望增加4（如果我爲每個這樣的元素創建一個DIV）。當我fiddle的代碼，它的作品。但是，我堅持如何解決這個問題。

我檢查d3.select（「＃圖形」）確實包含恰好一個要素。
我已經從控制檯運行腳本以避免加載順序問題。

我的網頁是Razor呈現的部分視圖。所有其他腳本，除了jQuery，我們需要在頁面加載時調用這些腳本時，它們將被刪除。

... 
<div id="#graph" ...></div> 
... 
@section style{ @Styles.Render("~/Page.css") } 
@section script{ 
    @Scripts.Render("~/Page.js") 
    @Scripts.Render("~/Scripts/d3.min.js") 
}

來源

2016-01-23 Konrad Viltersten

@Cyril你走了！這是我的一個不正確的診斷（由於缺乏能力和對D3過度混淆）。隨意去看看。 –

「我檢查了d3.select（」＃graph「）確實包含了一個元素。」你是說它返回一個元素的數組，或者該數組的單個成員實際上包含一個有用的DOM元素？如果我輸入d3.select（「＃withisjfsdopafwdgdfgdfgkl」）我得到的數組[1]返回的結果，它只是該數組中的dom元素爲null – mgraham

由於小提琴是好的，我想看到標記的頁面。特別是加載腳本的順序。在@mgraham上跟蹤，如果您刪除或重命名帶有'graph'的DIV，會發生什麼？ – 2016-01-23 16:20:16

我在代碼中看到三件事情。首先，使用選擇器d3.("#graph")參考<div id="graph" />。您在HTML的ID中有一個尖銳的符號。這就是爲什麼你沒有看到元素數量增加 - 他們被創建到一個不同的組件。相反，使用這個。

<div id="graph" ...>

附加點是腳本的順序。您的標記是錯誤的，因爲您在d3.min.js之前的Page.js中讀過。如果因爲網頁的onload中缺少d3（我假設它是第一個）而沒有收到錯誤，那麼您有多個引用。這一個是不需要的，因爲你已經有一個全球覆蓋它。或者你可以像這樣切換腳本的順序並跳過全局腳本。

@section script{ @Scripts.Render("~/Scripts/d3.min.js") @Scripts.Render("~/Page.js") }

最後一點是關於你的部分。我假設他們從佈局中調用，這只是一個局部視圖。如果是這樣，請關注渲染的順序。在佈局的不同階段調用部分視圖中的部分可能會產生問題。

來源

2016-01-23 16:44:55

不錯，趕上'id =「＃graph」'可能是問題所在。 – Mark

@Mark這是**一**的問題。但正如你看到的那樣，這些腳本並沒有按照正確的順序加載（儘管很容易認爲它們是）。 – 2016-01-23 16:50:20

D3上沒有創建DIV的輸入（）數據與多個值

回答

相關問題