通用实现方式 #
SMARTCHART实现筛选最简单的方法只需要配一个控件即可:
建立一个筛选清单数据集, 自动获取筛选的列表,那么可以这么写
select xxxx as city from tablename.....
-- 则会生成一个如下的数据集:
[['city'],[选项1],[选项2],..]
良好的习惯, 先保存在数据集 然后在筛选器数据集中的js编辑器(图形编辑器),填下如下代码:
//如要要美化, 自已加样式, 只要保证id="id_select__name__"
let dataset=__dataset__;
let table ='<span>标题</span><select id="id_select__name__">';
table = table + '<option value="" selected>----</option>';
for(let i=1;i<dataset.length;i++){
table = table + '<option>' + dataset[i][0] + '</option>';
}
table = table + '</select></div></div>'
dom__name__.innerHTML=table;
这个时候你已经可以看到筛选器了
现在我们来设定联动效果
假设需要被筛选的数据集的SQL这样写,数据集的序号是0 那么在需要被联动的数据集中,如使用pcity做为参数写查询, 比如:
select xx, xx, xx from tablename /* where xx = '$pcity' */
现在回到我们筛选器数据集,点击标题的位置, 我们需要使0号图形被筛选器联动, 设置如下即可:
然后你就可以看到筛选效果了, 非常的简单方便, 需要多个图形被联动, 只需用逗号分隔即可 比如: 0, 2, 4
筛选器的美化请学习样式调整