在另一個使用D3調用javascript函數的問題

Question

我正在學習如何使用D3.js來創建一些可視化的想法，而且我遇到了一些可能非常簡單並且可能僅僅是JavaScript的東西。

我想從另一個函數中調用一個函數。我創建了一個基本散點圖並希望用新的數據點重新加載它。這裏是JSFiddle。我真的很難過！

我覺得這是它看起來像這樣簡單的形式：

function firstFunction() { 
    var something; 
} 

function secondFunction() { 
    firstFunction(); 
} 

但似乎有時工作，有時沒有，也不可能找出原因。

Answer 1

發生什麼事情是，在jsfiddle中，默認情況下是將所有內容封裝在窗口加載運行的函數中。代碼如下所示：window.onload=function(){your stuff}

當您嘗試設置的onload，代碼結構，然後結構是這樣的：

function firstFunction(){ 
    function secondFunction(){ 
     do stuff 
    } 
} 

onload = secondFunction; 

問題是secondFunction不是firstFunction範圍之外訪問。這被稱爲變量範圍，並且編碼會在沒有它的情況下被吸引。

解決此問題的方法是將您的onload分配移至javascript塊。我建議使用內置d3的方式來做到這一點：d3.select('button').on('click',newScatter);這裏我選擇按鈕並添加一個單擊事件處理程序。這是有效的，因爲只有一個按鈕，但最好給按鈕一個類或ID並使用d3.select()。

如果你這樣做了，你的代碼仍然不起作用，但這是因爲你刪除了應該包含散點圖的SVG元素newScatter()（該行：elem.parentNode.removeChild(elem);）。但是，該按鈕將成功完成您要求的操作並刪除散點圖。

我已經創建了提琴here.