---
weight: 3
type : docs
bookFlatSection : false
---
### 通用实现方式
SMARTCHART实现筛选最简单的方法只需要配一个控件即可:  
建立一个筛选清单数据集, 自动获取筛选的列表,那么可以这么写
```sql
 Select xxxx as city from tablename..... 
 则会生成一个如下的数据集: 
 [['city'],[选项1],[选项2],..]
```
良好的习惯, 先保存在数据集
然后在筛选器数据集中的js编辑器(图形编辑器),填下如下代码:
```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;

```
这个时候你已经可以看到筛选器了
![输入图片说明](https://images.gitee.com/uploads/images/2021/1222/160420_fd513632_5500438.png "屏幕截图.png")

现在我们来设定联动效果

假设需要被筛选的数据集的SQL这样写,数据集的序号是0
```sql
//那么在需要被联动的数据集中,如使用pcity做为参数写查询, 比如:
select xx, xx, xx from tablename /* where xx = '$pcity' */
```

现在回到我们筛选器数据集,点击标题的位置, 我们需要使0号图形被筛选器联动, 设置如下即可:
![输入图片说明](https://images.gitee.com/uploads/images/2021/1222/160156_363aa5a2_5500438.png "屏幕截图.png")

然后你就可以看到筛选效果了, 非常的简单方便, 需要多个图形被联动, 只需用逗号分隔即可 比如: 0, 2, 4