I have set up a table using d3 js that successfully displays a saved csv file, called data.csv, in my html like so:
<script type="text/javascript"charset="utf-8">
d3.text("/Users/cool_stuff/data.csv", function(data) {
var parsedCSV = d3.csv.parseRows(data);
var container = d3.select("#meowwoof")
.selectAll("tr")
.data(parsedCSV).enter()
.append("tr")
.selectAll("td")
.data(function(d) { return d; }).enter()
.append("td")
.text(function(d) {
return d;
}
);
});
</script>
<tbody id="meowwoof">
</tbody>
This works great but I would like to add so if the user clicks on any row, it links so some URL that is, for example:
https://www.google.com/ + *value in first column of the given row thye clicked on*
I have found a few examples talking about how to do this, but they are for different initial set ups than what I am doing and thus they do not translate, and I am JS noob which makes it even harder to fit the explanations into my own setup
This is an example answer to a similar but different question I have not been able to figure out how to port:
As pointed out, you can attach a click event handler and redirect the user to the corresponding link
var container = d3.select("#meowwoof")
.selectAll("tr")
.data(parsedCSV).enter()
.append("tr")
.selectAll("td")
.data(function(d) { return d; })
.enter()
.append("td")
.text(function(d) {
return d;
}
)
.on('click',d=>{
// Assuming parsedCsv contains and d is a link
window.location.href = d;
})
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.