2015-11-07 4 views
1

У меня есть таблица, созданная d3, и добавлена ​​гиперссылка на значение (имя) в первом столбце. Как я могу сделать ссылку конкретной для каждого ученика на основе их StudentID. Другими словами, я хочу, чтобы ссылка была http: //mysite.php?studentid=129508 для первого ученика, http: //mysite.php?studentid=129562 для второго, а не http: //mysite.php для каждого студент.Таблица d3 - добавление определенной гиперссылки к значению

var data = [{"StudentID":"129508","FirstName":"Madison", "Math":"69.6","English":"64.1","History":"63.2"},   {"StudentID":"129562","FirstName":"Virginia","Math":"52.7","English":"64.1","History":"82.3"},   {"StudentID":"129770","FirstName":"Lucinda","Math":"93.4","English":"87.9","History":"84.6"},   {"StudentID":"129427","FirstName":"Ella","Math":"62.3","English":"64.1","History":"60.7"},   {"StudentID":"129203","FirstName":"Nicholas","Math":"74.9","English":"66.2","History":"73.2"}]; 
function tabulate(data, columns) { 
    var table = d3.select("body").append("table") 
     .attr("style", "margin-left: 100px") 
     .style("border-collapse", "collapse") 
     .style("border", "2px black solid"), 
    thead = table.append("thead"), 
    tbody = table.append("tbody"); 

thead.append("tr") 
    .selectAll("th") 
    .data(columns) 
    .enter() 
    .append("th") 
     .text(function(column) { return column; }); 

var rows = tbody.selectAll("tr") 
    .data(data) 
    .enter() 
    .append("tr"); 

var cells = rows.selectAll("td") 
    .data(function(row) { 
     return columns.map(function(column) { 
      return {column: column, value: row[column]}; 
     }); 
    }) 
    .enter() 
    .append("td") 
    .attr("style", "font-family: Courier") 
    .html(function(d, i) { 
       if (i === 0) { return "<a href=\"http://mysite.php\">" + d.value + "</a>"; 
       } else {return d.value; 
       } 
     }); 
return table; 
} 
var resultsTable = tabulate(data, ["FirstName", "Math", "English", "History"]); 

ответ

1

Два необходимые изменения

Прежде всего, необходимо хранить в задницу ID хорошо, когда вы делаете дэ данные:

var cells = rows.selectAll("td") 
     .data(function (row) { 
     return columns.map(function (column) { 
      console.log(row) 
      return { 
       column: column, 
       value: row[column], 
       id: row.StudentID //storing the id 
      }; 
     }); 
    }) 

Вторая ссылка идентификатор в URL

if (i === 0) { 
      console.log(d) 
      return "<a href=\"http://mysite.php?studentid="+d.id+"\">" + d.value + "</a>"; 
     } else { 
      return d.value; 
     } 
    }); 

Рабочий код here

Надеюсь, это поможет!

Смежные вопросы