Add a Dropdown Filter

Adding a dropdown filter requires configuring a layer.

Here is an example of adding a dropdown filter:

  1. Add a <config> section and make it dependent on the base type template for a dropdown select filter. You also need to configure the filter output parameters here. See Page Filters Basics for more details on filter config options.

    {
    "type" : "simple-select-filter",
    "height" : 200,
    "load_phase": 0,
    "filters" : {
        "output" : [
            {
                "name" : "dropdown",
                "urlparam" : "state"
            }
        ]
    }
    }
  2. Optional. Add a query to your layer file to acquire possible values for the dropdown. You can also hard-code the values in the layer file.

    <query name="myquery">
    SELECT options_col FROM mytable
    </query>
  3. Optional. Add a step to your <pipeline> to execute the query:

    {
    	"steps" : [
    	    {
    	        "action" : "bigquery_query",
    	        "query_name" : "myquery"
    	    }
    	]
    }
  4. Add rules to your <mappings> to map the options from the query to filter visualization. You also specify the default value for the dropdown as well.

    {
    	"rules" : [
    		{
    		    "column_name" : "options_col",
    		    "type" : "array",
    		    "figure_path" : [ "options" ]
    		},
    		{
    		    "value" : "Default Value",
    		    "type" : "literal",
    		    "figure_path" : [ "selected" ]
    		}
    	]
    }
  5. Add the visualization tag to your HTML page.