2016-07-08 83 views
2

我遇到了一些問題,圍繞着輸入函數的語法,並引用了部分數據。 我的最終目標是在地圖上繪製多個漸變路徑。我一直在關注http://geoexamples.blogspot.com.au/2014/04/d3-map-styling-tutorial-iv-drawing.html(關注bl.ocks.org/rveciana/10668944)中的代碼,該代碼從bl.ocks.org/mbostock/4163057獲取梯度函數代碼。 我已經得到了代碼工作,但我試圖將其擴展到一組路徑。用一個數據數組中的函數輸入()語句到多個數組? (添加多個漸變路徑)

我的問題是,我認爲,專注於代碼的以下部分:

svg.selectAll("path") 
    .data(quad(sample(line(track), 8))) 
.enter().append("path") 
    .style("fill", function(d) { return color(d.t); }) 
    .style("stroke", function(d) { return color(d.t); }) 
    .attr("d", function(d) { return lineJoin(d[0], d[1], d[2], d[3], trackWidth); }); 

比方說,我做它可以取代四新路(樣品(線(軌道),8))與track01。即

svg.selectAll("path") 
    .data(track01) 
.enter().append("path") 
.style("fill", function(d) { return color(d.t); }) 
.style("stroke", function(d) { return color(d.t); }) 
.attr("d", function(d) { return lineJoin(d[0], d[1], d[2], d[3], trackWidth); }); 

運行。現在,我有另一條路徑,名爲track02,如果我替換上面的track01,它將運行一條新路徑。我被困在讓他們兩人都工作。我想知道是否有人修復了下面的代碼工作的功能。

svg.selectAll("path") 
    .data([track01,track02]) 
.enter().append("path") 
.style("fill", function(d) { return color(d.t); }) 
.style("stroke", function(d) { return color(d.t); }) 
.attr("d", function(d) { return lineJoin(d[0], d[1], d[2], d[3], trackWidth); }); 

我試圖效仿中groups.google.com/forum/#!topic/d3-js/hM5DpnxAtVI被描述添加多個路徑。

+0

什麼track01'包含變量' ? – Gilsha

+0

我做了'var track0' = quad(sample(line(track),8))''。 – qreader001

回答

1

你的數據已經是一個數組,你所要做的就是CONCAT在一起那樣:

var data = track01.concat(track02); 

我創建一個搗鼓的例子:https://jsfiddle.net/7k0wqw7v/

+0

這對我有效。謝謝。 – qreader001

相關問題