我想在 html 中填充简单的下拉列表，
使用 csv 文件中存在的值。
我尝试类似的方法，但它不起作用。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
</body>
<script src="http://d3js.org/d3.v3.js"></script>
<script>
d3.csv("valuesforDD.csv", function(error, data) {
var select = d3.select("body")
.append("div")
.append("select")
select.selectAll("option")
.data(data)
.enter().append("option")
.attr("value", function (d) { return d; })
.text(function (d) { return d; });
}
</script>
</html>
我应该改变什么？
谢谢
-
d3.csv https://github.com/mbostock/d3/wiki/CSV#csv使用 CSV 文件的第一行作为列名称。您应该确保您的 CSV 文件如下所示：
value,label
1,"Item 1"
2,"Item 2"
3,"Item 3"
访问数据时必须使用字段名称attr and text功能。使用上面的 CSV 文件，您可以使用d.value and d.label.
这是代码的更新版本，您应该能够根据需要使用和调整：
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<script src="http://d3js.org/d3.v3.js"></script>
<script>
d3.csv("valuesforDD.csv", function(error, data) {
var select = d3.select("body")
.append("div")
.append("select")
select
.on("change", function(d) {
var value = d3.select(this).property("value");
alert(value);
});
select.selectAll("option")
.data(data)
.enter()
.append("option")
.attr("value", function (d) { return d.value; })
.text(function (d) { return d.label; });
});
</script>
</body>
</html>
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
