Legend panel gathers legends from all layers added to map and displays them in a list. They can be ImageWms, TileWms services for which legend is served by the WMS provider (geoserver, mapserver etc.) or Vector layers for which legend is derived from Openlayers style or SLD string. For that geostyler-legend library is used under the hood.

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({
      panelsEnabled: {
        legend: true //(true by default)
      }
    });
  }
}

If not using HslayersModule containing all components

Add HsLegendModule import:

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

Add HsLegendPanel component:

import {HsLayoutService } from 'hslayers-ng/core';
import {HsLegendModule} from 'hslayers-ng/components/legend';
@Component({
  selector: 'your-app-component',
  templateUrl: 'your-app-component.html',
})
export class YourAppComponent {
  constructor(hsLayoutService: HsLayoutService) {
    hsLayoutService.createPanel(HsLegendComponent, {});
  }
}