D3.jsを使用して読み込まれたcsvファイルから数値列をソートする方法 - 文字列として読み込まれる列

Question

D3.jsを使用してCSVファイルを読み込みました。私は今テーブルをユーザーがクリックしたヘッダーに応じてソート可能にしたいと思います。以下のコードはアルファベット順に完全にテーブル内のデータをソートしますが、それは、コスト/貯蓄列に来るとき、彼らは、そのようなのような文字列としてソートします：明らかに正しくない

$999 
$87 
$8890 
$7 
$5000 

。だから私はこれらの列の数学的な並べ替えを行うことができますかと思います。以下は、私のコードの大部分は、（ソートの小さな変化でhttp://bl.ocks.org/AMDS/4a61497182b8fcb05906と本質的に同じ）である：

</div> 
    <script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> 
    <script type="text/javascript"> 
     d3.csv("../reservations/arc.csv", function(error, data) { 
       if (error) throw error; 

       var sortAscending = true; 
       var table = d3.select('#page-wrap').append('table'); 
       var titles = d3.keys(data[0]); 
       var headers = table.append('thead').append('tr') 
           .selectAll('th') 
           .data(titles).enter() 
           .append('th') 
           .text(function (d) { 
             return d; 
           }) 
           .on('click', function (d) { 
             headers.attr('class', 'header'); 
             if (sortAscending) { 
             sortAscending = false; 
             this.className = 'aes'; 
             rows.sort(function(a, b){return d3.ascending(b[d],a[d])}); 
             } else { 
              sortAscending = true; 
              this.className = 'des'; 
              rows.sort(function(a, b){ return d3.descending(b[d], a[d])}); 
             } 

           }); 

       var rows = table.append('tbody').selectAll('tr') 
          .data(data).enter() 
          .append('tr'); 
       rows.selectAll('td') 
       .data(function (d) { 
        return titles.map(function (k) { 
          return { 'value': d[k], 'name': k}; 
        }); 
       }).enter() 
       .append('td') 
       .attr('data-th', function (d) { 
        return d.name; 
       }) 
       .text(function (d) { 
        return d.value; 
       }); 
     }); 
    </script> 

イムこれらの列は、番号を使用して数値として解析する必要があることを推測します（）と単純な正規表現がありますが、私はこれをどうやってやるのかは分かりません。 NaNを試しましたが、最初はすべて文字列として読み込まれているため、すべての列はその条件を渡します。または、別の柔軟な並べ替え機能があれば、是非とも

私はjavascriptを使い慣れていないので、ブリッジするのが少し難しいかもしれません。私はあなたの助けに感謝します。

Answer 1

あなたはデータセットのサンプルを提供していませんが、$ signを使用してコスト列を取得していることを前提としています。

この場合、最初に値をスライスすることから始めます：StringValue.slice(1)と数値部分を取得します。次に、+単項演算子またはparseInt("some string")を使用して整数として読み取ってみてください。

Answer 2

その列に条件付きの代替ソート関数を指定する必要があります。セイその列の名前は "コスト"：

... 

    .on('click', function(d) { 
     headers.attr('class', 'header'); 

     if (sortAscending) { 
     if (d === "Cost"){ 
      rows.sort(function(a, b) { 
      var b = +b[d].substring(1), 
       a = +a[d].substring(1); 
      return b < a; 
      }); 
     }else{ 
      rows.sort(function(a, b) { 
      return b[d] < a[d]; 
      }); 
     } 
     sortAscending = false; 
     this.className = 'aes'; 
     } else { 
     if (d === "Cost"){ 
      rows.sort(function(a, b) { 
      var b = +b[d].substring(1), 
       a = +a[d].substring(1); 
      return b > a; 
      }); 
     }else{ 
      rows.sort(function(a, b) { 
      return b[d] > a[d]; 
      }); 
     } 
     sortAscending = true; 
     this.className = 'des'; 
     } 
    }); 

---

コードhere作業します。