代碼不工作

Question

請找到代碼來生成

<style> 
text.shadow { 
stroke: #fff; 
stroke-width: 2.5px; 
opacity: 0.9; 
} 

我有代碼連接應顯示

Answer 1

您需要使用正確的數據。您有此功能：

function mousemove() { 
     var x0 = x.invert(d3.mouse(this)[0]), 
      i = bisectDate(data, x0, 1), 
      d0 = newDataArray[i - 1], 
      d1 = newDataArray[i], 
      d = x0 - d0.i > d1.i - x0 ? d1 : d0; 
     focus.attr("transform", "translate(" + x(d.i) + "," + y(d.fit) + ")"); 
     focus.select("text").text(Math.floor(d.fit)); 
     } 

在線3上，您正在使用data。 data在哪裏？應該是newDataArray對不對？

另外，這應該出現在控制檯日誌中，您是否在開發時閱讀控制檯日誌？

權，你有這樣的功能：

function mousemove() { 
      var x0 = x.invert(d3.mouse(this)[0]), 
       i = bisectDate(data, x0, 1), 
       d0 = newDataArray[i-1], 
       d1 = newDataArray[i], 
       d = x0 - d0.i > d1.i - x0 ? d1 : d0; 
      focus.attr("transform", "translate(" + x(d.i) + "," + y(d.fit) + ")"); 
      focus.select("text").text(Math.floor(d.fit)); 
     } 

這將不會運行在所有。您正在將d.i和d.fit傳遞給x和y軸。什麼是d.i？它不存在於您的數據中。

我已經把這個小提琴：https://jsfiddle.net/reko91/o5kwgb7x/3/

你mousemove功能不會工作作爲您沒有轉化對焦（圈子）正確。什麼是d.i？你需要做的是通過它你在這種情況下使用什麼作爲Y軸，所以，d.fit像這樣：在y

d = x0 - d0.fit > d1.fit - x0 ? d1 : d0; 

然後你翻譯它，在x d.upr和d.fit 。全鼠標移動功能：

function mousemove() { 
    var x0 = x.invert(d3.mouse(this)[0]), 
    i = bisectDate(newDataArray, x0, 1), 
    d0 = newDataArray[i - 1], 
    d1 = newDataArray[i], 
    d = x0 - d0.fit > d1.fit - x0 ? d1 : d0; 

    focus.attr("transform", "translate(" + x(d.upr) + "," + y(d.fit) + ")"); 
    focus.select("text").text(Math.floor(d.fit)); 
} 

更新小提琴：https://jsfiddle.net/reko91/o5kwgb7x/5/

我認爲你從這裏得到了例如：http://bl.ocks.org/mbostock/3902569

這裏是如何工作的崩潰。閱讀並理解它在做更多事情之前所做的事情。最好理解它，否則你會卡住。提示：使用控制檯日誌！