1

付属のテーブルを使用してチャートを作成しています。両方のデータは、ユーザーによって提供されたデータを含む html 入力要素から取得されます。今のところ、ユーザーが送信ボタンをクリックしたときにテーブルを更新する作業を行っています。

ユーザーが最初に送信ボタンをクリックすると、テーブルは正しく表示されますが、それ以降のクリックでは、基礎となるデータが正しく更新されても、テーブルは更新されません (グローバル変数cashflowsにはユーザーが入力したデータが含まれます)。

コードを以下に示しますが、jsfiddle もあります: http://jsfiddle.net/cyclical/xcGSu/5/ ([サンプル データの読み込み] ボタンを選択すると、いくつかのサンプル データが入力されます)。

最初のクリックでテーブルが正しく更新される場合、それはデータが DOM に正しくバインドされていることを示していますか?

ありがとう、ニール

var dollars = d3.format(",.2f");

function sampleData() {
    d3.select("#cf1")[0][0].value=50000;
    d3.select("#dt1")[0][0].value = "2007-05-10";
    d3.select("#cf2")[0][0].value = 20000;
    d3.select("#dt2")[0][0].value = "2011-01-11";
    d3.select("#cf3")[0][0].value = 50000;
    d3.select("#dt3")[0][0].value = "2012-07-19";
    d3.select("#cf4")[0][0].value = 40000;
    d3.select("#dt4")[0][0].value = "2012-08-03";
    d3.select("#endMV")[0][0].value = 190551.29 ;
    d3.select("#endDate")[0][0].value = "2013-09-30";  
}

d3.select("#sample") 
     .on("click", sampleData); 


var cashflows = [];
var total = 0;
var irr = 0;

// bind the cashflows array to a table for display 
var column_titles = ['Date','Cashflow','Days','IRR Cashflow'];
var columns = ['date','cf','days','irr_cashflow'];

d3.select("#results").selectAll('table').data([0]).enter().append('table');
var table = d3.select('table');

table.selectAll('thead').data([0]).enter().append('thead');
var thead = table.select('thead');

table.selectAll('tbody').data([0]).enter().append('tbody');
var tbody = table.select('tbody');

table.selectAll('tfoot').data([0]).enter().append('tfoot');
var tfoot = table.select('tbody');


// append the header row
thead.append("tr")
    .selectAll("th")
    .data(column_titles)
    .enter()
    .append("th")
    .attr("align", function(d) {if (d=='Date') { return "left"} else { return "right"}})
        .text(function(column) { return column; });



function calculateIRR(){ 

        cashflows = [];

    var cfvalues = [];
    var cfdates = [];

    // get cashflows
    d3.selectAll("input.cashflow")[0]
        .forEach(function(d,i) { 
            if (d.value) {cfvalues.push( 1 * d.value )}; 
            }
         )


    // get dates
    d3.selectAll("input.cfdate")[0]
        .forEach(function(d,i) { 
            if (d.value) {cfdates.push( d.value)}; 
            }
         )

    // get ending MV and associated date; MV is multiplied by -1
    cfvalues.push(-1 * d3.select("#endMV")[0][0].value);
    cfdates.push(d3.select("#endDate")[0][0].value);

    // convert date strings to date objects
    var dates = cfdates.map(function(d) { return new Date(d.replace(/-/g, "/"))});

    // calculate the IRR; use 5% as starting value 
    var rate = XIRR(cfvalues ,dates, .05);  
    irr = rate;


var r = d3.select("#ratedisplay").selectAll("div")
   .data([rate])
     .enter()
     .append("div")
     .attr("class","rate")
        .text(function(d,i) {return "IRR: " + d}); //{return "IRR:" + dollars(d) + ""});


    var len = cfvalues.length;
    var last_day = dates[len -1];

    // construct final cashflow array for binding
    for (var i = 0; i < len; i++) {  
        var cf_days = moment(last_day).diff(moment(dates[i]), 'days');

        var irr_cashflow = FV(rate, cf_days/365 , 0, cfvalues[i],0);
        total += irr_cashflow;

                cashflows.push(
                {'cf': cfvalues[i], 'date': dates[i], 'days' : cf_days, 'irr_cashflow': irr_cashflow}       
            );
    };


var rows = tbody.selectAll("tr")
    .data(function(d) {return cashflows} )
    .enter()
    .append("tr");



var cells = rows.selectAll("td")
    .data(function(row) {
        return columns.map(function(column) {
            return {'name': column, 'value': row[column]};
        });
    })
    .enter()
    .append("td")
    .attr("align",function(d) {
        if (d.name == 'date') { return "left" } else {return "right"}
    })
        .html(function(d) { 
           if (d.name == 'date') {
                return d3.time.format("%Y-%m-%d")(d.value);
           } else {
                return dollars(d.value);
           }     
        });


rows.exit().remove(); 
cells.exit().remove();

}

d3.select("#submit") 
     .on("click", calculateIRR);
4

0 に答える 0