我的代码(index.html):
<!DOCTYPE html>
<meta charset='utf-8'>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script type="text/javascript" src="http://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://raw.githubusercontent.com/mpryvkin/Plugins/master/pagination/simple_numbers_no_ellipses.js"></script>
<link rel='stylesheet' href='style.css'>
<link rel="stylesheet" type="text/css" href="http://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css">
<script>
$(document).ready(function() {
$('#example').DataTable( {
"pagingType": "full_numbers"
} );
} );
</script>
</head>
<body>
<table id="example" class="display" cellspacing="0" width="100%">
</table>
<script>
var tabulate = function (data,columns) {
var table = d3.select('#example')
var thead = table.append('thead')
var tbody = table.append('tbody')
thead.append('tr')
.selectAll('th')
.data(columns)
.enter()
.append('th')
.text(function (d) { return d })
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')
.text(function (d) { return d.value })
return table;
}
d3.csv('some1.csv',function (data) {
var columns = ['client_ip']
tabulate(data,columns)
})
</script>
</body>
</html>
some1.csv:
client_ip
"192.168.7.123"
"192.168.7.102"
"192.168.7.83"
"192.168.7.80"
"192.168.7.74"
"192.168.7.100"
"192.168.7.25"
"192.168.7.20"
"192.168.7.89"
"192.168.7.92"
"192.168.7.78"
"192.168.7.12"
"192.168.7.15"
"192.168.7.18"
"192.168.7.22"
我想添加多选框。所以选定的client_ip应存储在一个div中。
有人可以就此问题向我提出建议吗?