D3 <path>在其座標

我試圖以此爲榜樣NAN值：Line Chart: bl.ocks.org，但我不斷收到錯誤，如：（？過時）D3 <path>在其座標

d3.min.js:1 Error: Invalid value for attribute d="MNaN,450LNaN,425.96810933940776LNaN,386.2186788154896LNaN,373.917995444>1913LNaN,375.28473804100224LNaN,379.0432801822323LNaN,368.5649202733485LNa>N,368.4510250569475LNaN...

我已經解決了很多錯誤的部分這個例子，但我不能破解這一個。我已經讀過關於時間對象的問題，並將它們格式化爲導致類似問題的字符串，但無論我如何格式化d.date，我的輸出始終都有NAN。

JSON：

var lineData = [ 
{"date":"24-Apr-07","close":93.24}, 
{"date":"25-Apr-07","close":95.35}, 
{"date":"26-Apr-07","close":98.84}...

JS：

var parseTime = d3.time.format("%d-%b-%y").parse; 
... 

svg.append("path") 
     .datum(data) 
     .attr("class", "line") 
     .attr("d", line); 

function type(d) { 
    d.date = parseTime(d.date); 
    d.close = +d.close; 
    return d; 
}

上Codepen全碼：http://codepen.io/SammyJ/pen/qZoEdO

來源

2016-04-24 Pixelpush3r

：新數據，因此它並不需要重新處理的數據，因此這兩條線

x.domain(d3.extent(data, function(d) { return parseTime(d.date); })); y.domain(d3.extent(data, function(d) { return +d.close; }));

需要被改爲：

x.domain(d3.extent(data, function(d) { return d.date; })); y.domain(d3.extent(data, function(d) { return d.close; }));

請參閱更新的例子你的類型函數？ – echonax

你在這裏失蹤的type功能。

您需要的類型函數應用於原始數據：

var data = lineData.map(type);

這是在樣品中加載階段，你掏出來完成：

d3.tsv("data.tsv", type, function(error, data) { 
    if (error) throw error;

文檔： https://github.com/mbostock/d3/wiki/CSV

Note that the values themselves are always strings; they will not be automatically converted to numbers. JavaScript may coerce strings to numbers for you automatically (for example, using the + operator). By specifying an accessor function, you can convert the strings to numbers or other specific types, such as dates:

此外，您的域正在如果您使用的 http://codepen.io/anon/pen/aNjgEw

來源

2016-04-24 17:36:21 paradite

太棒了。所以我很困惑的一大部分是如何使用本地JSON對象而不是外部數據和d3.tsv（）或d3.csv（）...在data.map（）中調用類型是我沒有做出的飛躍。謝謝！ – Pixelpush3r

map對於JavaScript來說是一個非常有用的函數，請查看文檔和示例以獲取有關如何使用它的更多詳細信息：https：//developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/地圖 – paradite

D3 <path>在其座標

回答

相關問題