Dorisxd 2019-04-07 20:09 采纳率: 100%
浏览 432
已采纳

d3 data( , function(d){return d.id;}) 用不了？

 <body>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</body>

<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script>

var data = [
  {name: "Locke", number: 4},
  {name: "Reyes", number: 8},
  {name: "Ford", number: 15},
  {name: "Jarrah", number: 16},
  {name: "Shephard", number: 31},
  {name: "Kwon", number: 34}
];

d3.selectAll("div")
  .data(data, function(d) { console.log(d);return d ? d.name : this.id; })
    .text(function(d) { return d.number; });

</script> 
</body>

如上面的代码，得到的网页是空白的那个键值的function一直用不了

  • 写回答

1条回答 默认 最新

  • Dorisxd 2019-04-07 20:31
    关注

    div改为：

    <div id="Ford"></div>
<div id="Jarrah"></div>
<div id="Kwon"></div>
<div id="Locke"></div>
<div id="Reyes"></div>
<div id="Shephard"></div>

    若是空的标签，要先data绑定数据再使用键值函数

    <script src="https://d3js.org/d3.v5.js"></script>

<body>
    <p></p>
    <p></p>
    <p></p>


<script>
    //未绑定键值
    var persons = [{id: 3, name:"1xx"},
                    {id: 6, name:"2xx"},
                    {id: 9, name:"3xx"}];
    var p = d3.select("body").selectAll("p");

    //先对数据进行绑定
    p.data(persons).text(function(d){return d.id + " : " + d.name;});

    var persons = [{id: 6, name:"1xx"},
                    {id: 3, name:"2xx"},
                    {id: 9, name:"3xx"}];
    var p = d3.select("body").selectAll("p");
    //再根据键值排序
    p.data(persons, function(d){return d.id;}).text(function(d){return d.id + " : " + d.name;});

</script> 
</body>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题？

悬赏问题

  • ¥15 如何在scanpy上做差异基因和通路富集？
  • ¥20 关于#硬件工程#的问题，请各位专家解答！
  • ¥15 关于#matlab#的问题：期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707，使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错，维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯：Person is not mapped，如何解決？
  • ¥15 c++头文件不能识别CDialog