Skip to content

Search toolbar

Filip Leitner edited this page Apr 30, 2024 · 6 revisions

Search

The search toolbar has the same functionality as the search toolbar, except it is easy to hide and does not take up much screen space.

Config parameters

List of useful config parameters for the search toolbar can be found here:

componentsEnabled

searchProvider

geonamesUser

Enable/disable

import {HsConfig} from 'hslayers-ng/config';
@Component({
  selector: 'your-app-component',
  templateUrl: 'your-app-component.html',
})
export class YourAppComponent {
  constructor(hsConfig: HsConfig) {
    this.HsConfig.update({
      componentsEnabled: {
        toolbar: true, //(true by default)
        guiOverlay: true, //(true by default)
        searchToolbar: true, //(true by default)
      }
    });
  }
}

If not using HslayersModule containing all components

Add HsSearchModule import:

import {HsSearchModule} from 'hslayers-ng/components/search';
@NgModule({
  imports: [HsSearchModule],
})
export class YourAppModule {}

Add HsSearchToolbarComponent component:

import {HsSearchToolbarComponent} from 'hslayers-ng/components/search';
import {HsLayoutService } from 'hslayers-ng/core';
@Component({
  selector: 'your-app-component',
  templateUrl: 'your-app-component.html',
})
export class YourAppComponent {
  constructor(hsLayoutService: HsLayoutService) {
    hsLayoutService.createOverlay(HsSearchToolbarComponent, {});
  }
}
Clone this wiki locally