Skip to content

Customize search panel

Marten edited this page Jun 10, 2022 · 10 revisions

Customize search panel

The search panel consists of many search facets, you can add, delete or update the search facets by editing a html file named SearchPanel.html in [Tomcat8]/webapps/geoportal/app/main/templates/. Each search facets is included in a <div> ...</div> block.

Add a search facet

  • Open SearchPanel.html in a html editor
  • Find the <div> ...</div> block similar to the facets to be added, e.g.
        <div data-dojo-type="app/search/TermsAggregation"
        data-dojo-props="field:'sys_owner_s',open:false,label:'${i18n.search.criteria.owner}'">
      </div>
    
  • Copy and paste the <div> ...</div> block to the appropriate location
  • Perform necessary editing, for a facet for "contact_role_s", it will be something like below. For an explanation of the parameters, please see description in the table below
         <div data-dojo-type="app/search/TermsAggregation"
        data-dojo-props="field:'contact_role_s',open:true,label:'contact_role'">
      </div>
    
  • Save the file and refresh geoportal to verify the facet is added to the search panel

Delete a search facet

  • Open SearchPanel.html in a html editor
  • Find the <div> ...</div> block for the facets to be deleted
  • Comment out the block or delete the block
  • Save the file and refresh geoportal to verify if the facet is removed from the search panel

Update the Map search facet

The map search facet allows for spatially filtering the catalog by limiting results to be within or overlapping with the visible extent of the map. There is no need to draw a box on the map, just zoom to your area of interest and select the filter option.

The contents of the map is controlled by the settings in app-config.js:

  searchMap: {
    basemap: "streets",
    basemapUrl: "",
    isTiled: false,
    autoResize: true,
    wrapAround180: true,
    center: [-98, 40],
    zoom: 3
  },

where:

  • basemap = one of the named basemaps in ArcGIS Online
  • basemapUrl = URL to an ArcGIS Server Map Service to be used instead of the named basemap. Use either basemap or basemapUrl.
  • isTiled = indicates if the map is tiled or not
  • autoResize = unused at the moment
  • wrapAround180 = indicates if the map should continue when panning beyond the 180 degree longitude in any direction
  • center = the center the map will orient on
  • zoom = zoom level. low number is zoomed out, high number is zoomed in. This depends on the zoom levels defined in the named basemap and uses typical zoom levels common in tiled web maps.

It is also possible to add multiple locators to the map to support finding your area of interest. In order to do this include the following in the searchMap object in app-config.js:

    locatorParams: {  
      sources: [
        {
          url: "https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer",
          name: "World Locator",
          singleLineFieldName: "SingleLine",
          placeholder: "Search by Address",
          countryCode: "US",
          maxResults: 10,
          searchInCurrentMapExtent: false,
          type: "locator"
        },
        {
          url: "https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer",
          name: "Regional Locator",
          singleLineFieldName: "SingleLine",
          placeholder: "Search by Address",
          countryCode: "US",
          maxResults: 10,
          searchInCurrentMapExtent: true,
          type: "locator"
        }
      ]
    }

where:

  • url = link to the locator service
  • name = name of this locator
  • singleLineFieldName = name of the single field locator input field
  • placeholder = default text as it appears in the locator search box
  • countryCode = country code for the locator
  • maxResults = maximum number of results returned from the locator
  • searchInCurrentMapExtent = determines if the location search is limited to the current search map extent or not
  • type = type of location search service. At this point only 'locator' is supported.

Update a search facet

  • Open SearchPanel.html in a html editor
  • Find the <div> ...</div> block for the facets to be updated
  • Make the necessary updates, for an explanation of the parameters, please see description in the table below
  • Save the file and refresh geoportal to verify if the facet is updated in the search panel

Description for some of the parameters

Parameter Name Description
allowAggregation Showing aggregation of records
data-dojo-props List of properties for the facet
data-dojo-type Template type
field Name of Elasticsearch field, an easy way to find the field name is to look at the json output in search results
interval Units for clustering, counts per year/day etc., used in the temporal facet
label Label to be shown on the search panel, it can be either a string or variable pointing to a string
nestedPath Nested query in Elasticsearch, e.g. nestedPath:'timeperiod_nst' in time period facets
open If set to true, the facet will be open when geoportal starts.
pointField Name of point field in Elasticsearch
toField Name of field in Elasticsearch, e.g. for end date in time period facet
Clone this wiki locally