DC.js模拟点击图表并触发过滤器
dc.js simulate click on chart and trigger filter on
我想做什么:
我有一个条形图,其中x轴代表时间。可以通过用鼠标选择一段时间来选择一段时间,所有图表都会根据选择正确调整。
但是,有时很难从确切日期转到确切日期,我想添加一个日历,可以在其中选择这些日期。
理想情况下,在日历上选择日期应与在条形图上使用鼠标选择时间段具有相同的效果。
尝试过但不喜欢:
我尝试创建第二个时间维度,并让日历选择该维度。但是,这会使条形图最小值和最大值调整为该选择 条形图不涵盖时间维度的完整维度,而仅涵盖日历上的选定时间段。这就是我想避免的。
如何在图表本身上精确模拟选择?
多谢。
编辑:
我试图理解对评论提出的建议。 让我向您展示一些代码。
我有一个条形图:
var moveChart = dc.barChart("#move-chart","chart2");
这是人们刷上来执行时间过滤器的那个。
moveChart
.width(700)
...
.dimension(timeDim)
.group(foo)
现在,假设我在控制台上做:
timeDim.filterRange([minTime,maxTime]);
dc.renderAll("chart2");
这使得其他图表反映所选内容,但不反映移动图表。
我也试图实施戈登的评论,但我不明白。在控制台中,我可以看到moveChart.filters。没有实现任何像 RangedFilter 或 TwoDimensionalFilter 这样的过滤器,所以我不确定如何在画笔上执行过滤器功能。
谢谢。
图表不会在其自身的维度上观察过滤器,所以我认为你真的想要画笔选项。
filter = dc.filters.RangedFilter(filter[0], filter[1]);
moveChart.filter(filter);
远程过滤器文档
您只需要在图表上设置筛选器;图表将在维度上设置筛选器。
相关文章:
- 如何在angular.js中动态应用自定义过滤器
- DC.js带过滤器的订购
- Angular js过滤器在某些移动设备上不起作用
- Vue.js如何在定义API变量之前实现自定义过滤器
- (角度.js)如何通过过滤器计算数组中有多少项目
- 在Angular.JS-ng隐藏vs过滤器中将对象分隔为两组
- 如何在Angular js中返回html代码作为过滤器的输出
- 显示骨干js过滤器
- 在kibana3/elastic.js中合并两个过滤器
- Angular js自定义过滤器未定义
- 自定义Angular.js过滤器在IE8中不返回任何内容,在Chrome/FF中运行良好
- 如何将Underscore.js过滤器与对象一起使用
- Vue js 在输入字段中对 v-model 应用过滤器
- 如何使用fabric.js添加图像过滤器
- 如何使用angular js过滤器格式化数组中的值
- 为织物形状的图案图像添加过滤器.js
- 过滤器.js在 ReactJS 中
- Gettin 交叉过滤器.js错误“太多递归”
- 如何简化用下划线编写的过滤器.js
- 简单条形图按字符串名称分组,带有 DC.js D3.js 和交叉过滤器.js