Bir javascript ile yüklemeden önce bir CSV'den veri seçme (d3 kitaplığı)

Question

Bir javascript ile yükleyemeden önce bir CSV dosyasından bazı verileri seçmek istiyorum (d3 kitaplığı ile).

Bu i CSV yüklemek nasıl:

d3.csv("data.csv", function(csv) { 
    vis.datum(csv).call(chart); 
     }); 

Ve bu CSV dosyasının bir örneği verilmiştir: ben sadece i evvel Second Class ve First Class satırları seçmek istediğiniz Örneğin

Class,Age,Sex,Survived 
First Class,Adult,Male,Survived 
First Class,Adult,Male,Survived 
First Class,Adult,Male,Survived 
First Class,Adult,Male,Survived 
First Class,Adult,Male,Survived 
First Class,Adult,Female,Survived 
First Class,Adult,Female,Survived 
First Class,Adult,Female,Survived 
Second Class,Adult,Male,Perished 
Second Class,Adult,Male,Perished 
Second Class,Adult,Male,Perished 
Third Class,Adult,Male,Survived 
Third Class,Adult,Male,Survived 
Third Class,Adult,Male,Survived 
Third Class,Adult,Male,Survived 
Third Class,Adult,Male,Perished 
Third Class,Adult,Male,Perished 
Crew,Adult,Male,Perished 
Crew,Adult,Male,Perished 
Crew,Adult,Female,Survived 
Crew,Adult,Female,Survived 

d3.csv ile yükleyin.

Sadece CSV'deki diğer satırları silebileceğimi biliyorum, ancak kullanıcının hangi kategorileri kullanmak istediğini seçebilmesi için bir işlev yapmak istiyorum. Umarım bu biraz mantıklıdır. Hızlı cevap

Answer 1

, istediğiniz satırları, ör .:

d3.csv("data.csv", function(csv) { 
    csv = csv.filter(function(row) { 
     return row['Class'] == 'Second Class' || row['Class'] == 'First Class'; 
    }) 
    vis.datum(csv).call(chart); 
}); 

sen, kodlayıcı, filtre seçerken, bu kolaydır seçmek için .filter() kullanın. Bununla birlikte, kullanıcı etkileşimi tarafından seçilmesi gerekiyorsa, daha karmaşık bir işlev oluşturmanız gerekecektir.

// an example filters object 
var filters = { 
    'Class': ['First Class', 'Second Class'], 
    'Sex': 'Female' 
}; 

d3.csv("data.csv", function(csv) { 
    csv = csv.filter(function(row) { 
     // run through all the filters, returning a boolean 
     return ['Class','Age','Sex','Survived'].reduce(function(pass, column) { 
      return pass && (
       // pass if no filter is set 
       !filters[column] || 
        // pass if the row's value is equal to the filter 
        // (i.e. the filter is set to a string) 
        row[column] === filters[column] || 
        // pass if the row's value is in an array of filter values 
        filters[column].indexOf(row[column]) >= 0 
       ); 
     }, true); 
    }) 
    console.log(csv.length, csv); 
}); 

(Sen .reduce() ile bunu yapmak zorunda değilsiniz, ama nasıl gibi: Eğer tuşları satırlara karşılık gelen, filters denilen bir nesne kullanıcı tercihlerini kaydetmiş olduğu varsayıldığında, seçeneklerden biri gibi görünebilir temizleyin.

Muhtemelen durumda olduğu gibi, yükleme sırasında bu filtrelemeyi yapmak istemezsiniz, bunun yerine kullanıcı girdisine bağlı olarak dinamik olarak filtreleyebilirsiniz, yine de filtre işlevini kullanabilirsiniz. csv bellekte bir yerde saklamak ve kullanıcı etkileşimleri tarafından tetiklenen bir update() işlevinde anında filtrelemek.