Verileri d3 ile eşleştirilemiyor

Question

ABD'de d3 kullanarak her ilçeyi temsil eden bir geojson haritası oluşturmaya çalışıyorum ve sonra da sunucudan bir csv dosyası getirdikten sonra şekillerin renklerini dinamik olarak değiştiriyorum.

Her ilçede şekil svg yol içindeki bir niteliği olarak atanan farklı bir kimliğe sahiptir ve div aşağıdaki tarzda içinde yuvalanmış: <div id="map"><svg ...><path ...></path></svg></div>):

<path class="county" cid="49003" d="M268.97942180906057, 
180.25136249051877L267.99968608232916,179.94417907047466L266.73835706796865, 
181.58920557665408L263.8700579925135,181.0924673795946L259.5224347320402, 
185.30429000298852L255.0646299840323,185.9781064759694L237.98063840912738, 
182.81739842586433L241.51437533212444,164.45244088140475L255.62126287079593, 
166.99664084530673L266.95905635804127,169.0065343660998L268.07266792127234, 
171.7741286687334L267.5663893622565,174.8022351145563L267.9956982687371, 
178.0311646832157L268.89925024903414,178.0929836991428Z"></path> 

ben d3 ile elemanlarını seçmek mümkün değilim

ve özellik değerleri konsola yazdırır, ancak özelliklerden herhangi birini ekleyemiyorum veya değiştiremiyorum.

bar = data.map(function(d) { return [d["n"], d["i"], +d["t"]]; }); 

Bu tür bir gibi görünüyor:

bar.forEach(function(d, i){ 
    d3.select('#map').select('.county[cid="' + d[1] + ']"').attr('foo', 'bar') 
}); 

bar değişken önceki komut yüklenen CSV veri: İşte

ben kullanmaya çalışıyorum kod bir örnektir kolay ve açık bir çözüm, ancak bunun neden işe yaramayacağını anlayamıyoruz. Yardımın için teşekkürler.

Answer 1

Şekil verilmiş.

kritik bir parçası seçicinin içindeyken tırnak işareti yerleştirme idi:

orijinal:

d3.select('#map').select('.county[cid="' + d[1] + ']"').attr('foo', 'bar') 

... olur (.attr yakın ayraç tarafından çift tırnak işareti dikkat edin) :

d3.select('#map').select('.county[cid="' + d[1] + '"]').attr('foo', 'bar') 

ben console.log bunu baskılı zaman seçilen nesne dizisi dönebildi nasıl bilemezsin.