Draw panel - hslayers/hslayers-ng GitHub Wiki

Drawing tools

Drawing tools allow the user to draw vector features, such as points, circles, lines, polygons, and add them to a new drawing layer or layer stored on the Layman server. The drawn feature will be saved in the layer, "Drawing to" points to. Each new feature added will also be the last feature selected. Details will be displayed in the drawing panel section below the drawing tools as 'Features selected'. Each feature can be edited after it is selected with the selection tool. To select multiple features, the user can use the box selection tool as an additional tool for the selection tool. Below the selection tool is also the option to select all features at once. In case the user wants to make the feature geometry, at the time of editing, to snap to the nearest feature, the 'Allow snapping' option must be enabled.

Draw panel

Config parameters

List of useful config parameters for the draw panel can be found here:

defaultDrawLayerPath

openQueryPanelOnDrawEnd

preserveLastSketchPoint

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

If not using HslayersModule containing all components

Add HsDrawModule import:

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

Add HsDrawComponent component:

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