如何使用 d3 选择数据中的类别
How to select categories within data using d3
我是D3的初学者,任何帮助将不胜感激。
在此图表中,为类别"获胜"的每个条目生成一个圆圈。因此,在这种情况下,生成了 4 个半径不同的圆。
我想返回"胜利"的数据,但只返回"最佳影片"类别的数据。在这种情况下,只会生成 2 个圆圈。这可以通过添加到函数-- .attr('r', function(d) {return radiusScale(d.wins);})来实现,如果是这样,我应该改变什么?
var data = [
{decade: '1920s', category: 'Best Picture', wins: 2, nominations: 3},
{decade: '1920s', category: 'Best Director', wins: 1, nominations: 9},
{decade: '1930s', category: 'Best Picture', wins: 3, nominations: 6},
{decade: '1930s', category: 'Best Director', wins: 1, nominations: 7},
];
var radiusScale = d3.scale.sqrt().domain([0, 40]).range([0, 40]);
d3.select('svg')
.selectAll('circle')
.data(data)
.enter()
.append('circle')
.attr('r', function(d) {return radiusScale(d.wins);})
.attr('cx', function(d, i) {return i * 80 + 50;})
.attr('cy', 50);
使用 .filter()
函数仅获取所需的数据元素:
d3.select('svg')
.selectAll('circle')
.data(data.filter(function(d) { return d.category == "Best Picture"; }))
.enter()
...
相关文章:
- PHP:显示sqlite数据库中的html格式数据,使用tinymce保存
- 如何从文本区域获取数据并使用javascript进行解密
- 如何确保在AngularJS中,数据在使用之前先加载
- 如何在带有nunjucks和gullow数据的JSON数据中使用带有HTML的内容
- 表单中的数据未使用javascript中的serialize()获取
- 如何更新集合数据并使用骨干木偶重新渲染
- 从URL获取JSON数据并使用innerHTML - 如何显示
- 我想从网站收集数据并使用PHP将它们存储在数据库中
- 为什么没有标记但数据可见(使用 JSON)
- 检索JSON数据并使用AJAX在表中显示
- 连接数据并使用D3在地图中弹出
- EXIF图像数据可以使用JSSOR在页面上显示吗
- 如何在检索到数据后使用drawCallback执行代码
- angularjs:自定义直接中的绑定数据在使用“”后不再更新;track-by-;在ng重复中
- 从维基百科检索数据并使用angularjs显示
- 如何使用数据列表使用 JavaScript 提交表单
- 数据表 - 使用 fnUpdate 更新行将替换不同的行
- 在数据集中使用递归搜索 2D 数组模式
- 如何在网页中嵌入隐藏数据并使用 DOM 恢复它
- 用于定期聚合数据并使用 Node.js 为其提供服务的基础架构