Dear FCC community:
I want to create a table but for some reason out of nowhere a th-tag got added before the tds in the thead.
I want the first square before the a to dissappear. My code looks like the following.
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://d3js.org/d3.v5.min.js"></script>
<meta charset="UTF-8">
<title>Midterm</title>
<style>
td, th {
padding: 2px 4px;
border: 1px black solid;
}
</style>
</head>
<body>
<table id="table">
<thead>
<th>
<td>a</td>
<td>b</td>
<td>c</td>
</th>
</thead>
<tbody></tbody>
</table>
<script>
let data = [{a:1, b:3, c:5}, {b:4, c:6}];
let keys = ['a','b','c'];
let table = d3.select("#table");
let body = table.select('tbody');
let row = body.selectAll('tr')
.data(data);
let cell = row.enter().append("tr").selectAll('td')
.data(function(row){
return keys.map(function(column){
return {
column: column, value: row[column]
}
});
}).enter()
.append("td")
.text(function(d,i){
return d.value;
});
</script>
</body>
</html>
I hope someone can please help out.
