Search toolbar - hslayers/hslayers-ng GitHub Wiki

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.

Search toolbar component

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, {});
  }
}